1

これは私に頭痛を与えています...

もちろん、同じ行の左側に固定の高さ/幅、右側にテキストの画像を表示しようとしています。コンテナ全体の動的幅はビューポートの90％です。つまり、左側の画像は固定されているため、右側のテキストも動的幅（90％-画像幅）になります。テキストは左揃えにする必要があるため、「float：right」は機能しません。フロート、整列、テーブルセルなどの無数の組み合わせを試しましたが、何も機能しません...最も近いのは、同じ行にあることですが、テキストは強制的に右に整列されました。

私が言っていることの画像：http：//i.imgur.com/QRDhLro.png

#container {
overflow:hidden;
position:relative;
width:90%;
min-width:800px;
margin-bottom:20px;
margin-top:20px;
margin-left:auto;
margin-right:auto;
}
.leftimage {
width:600px;
height:100px;
}
.righttext {    
float:right;
}

...
...

<div id="container">

    <div class="righttext">lorem ipsum lorem ipsum <br> lorem ipsum lorem ipsum </div>

    <div class="leftimage"><img src="../pictures/test.png"></div>

</div>
4

2 に答える 2

6

動く

<div class="righttext">lorem ipsum lorem ipsum <br> lorem ipsum lorem ipsum </div>

後

<div class="leftimage"><img src="../pictures/test.png"></div>

CSS：

.righttext{
    float: none;
    margin-left: 600px;
}
于 2013-03-25T19:15:46.923 に答える
4

多分ただ：

<img src="#" align="left">
<p>This is my paragraph to the right of my image</p>

ここに示されているように、これは機能します：http: //jsfiddle.net/tWqwh/

于 2013-03-25T19:15:01.743 に答える