0

我有两个<div>s，其中一个存在图像，另一个存在文本。

现在，我想确保文本必须位于中心图像下方。如果我有<div>它会很容易，但我应该使用现有的结构，其中包含单独<div>的 s 用于文本和图像。

现在，我已经为下面的文本编写了这样的 CSS<div class="sidebyside_pera">

.sidebyside_pera p {
    background:blue;
    float:left;
    text-align:center;
    margin:0 auto;
    position:relative;
    margin-left:-70px;
    margin-top:110px;
}

下面是图片的CSS <div class="sidebyside_image">

.sidebyside_new {
    float:left;
}

上面的 CSS 适用于固定预设大小的图像。如何为变量图像的图像设置 CSS，以便文本位于中心图像下方。

这是我目前的结构：

<div class="sidebyside_new">
    <img src="<%=imageLink %>" alt="<%=altText %>" width="<%=imgwidth %>" height="<%=imgheight %>" />
</div>
<div class="sidebyside_pera">
   <p> <%=description %> </p>
</div>
4

1 回答 1

5

在另一个 div 中包装 div（一个带有图像，一个带有文本）应该可以工作。

<div class="container">
    <div class="image">
        <img src="image.jpg" />
    </div>
    <div class="text">
        <p>Some text</p>
    </div>
</div>

http://jsfiddle.net/PaulvdDool/VVQxZ/

于 2013-06-03T14:31:06.353 回答