1

以下を使用して、画像を左側に表示し、関連情報を画像の右側に表示します。説明、住所、その他の情報が画像の高さを超える場合、テキストは画像の下に入ります。私の質問は、画像の下に行かないようにテキストを保持する方法ですが、コラムのように続けるにはどうすればよいですか?

.eventphoto 
{
   padding:1px;
   width:200px; 
   float:left;
   margin-right:15px;
   border-radius:2px;
}
.desc 
{
   font-size:0.8em;
   line-height:13pt; 
}


<div class="desc">

<img class="eventphoto" src="">

<div style="float:left;">
<p>DESCRIPTION</p>
.
.
.
</div>
</div>
4

3 に答える 3

0

次のように、画像では float:left を、テキストでは float:right を試してください。

.eventphoto 
{
    padding:1px;
    width:200px; 
    float:left;
    margin-right:15px;
    border-radius:2px;
}
.desc 
{
    font-size:0.8em;
    line-height:13pt; 
    float:right;
}
于 2013-07-22T01:48:38.433 に答える
0

私overflow: hidden;はあなたの最善の策だと思います。使用中のデモは次のとおりです。

http://jsbin.com/owesiw/1/edit

于 2013-07-22T01:49:55.010 に答える