0

私は 2 つ<div>の s を持っています。1 つはイメージで、もう 1 つはテキストです。

ここで、テキストが中央の画像の下に来るようにします。持っていれば<div>簡単ですが<div>、テキストと画像に別々の を含む既存の構造を使用することになっています。

今のところ、下のテキストにこのような 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 (1 つは画像、もう 1 つはテキスト) を別の 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 に答える