0
<div>
 <div id="div1" class="myimg">
 </div>
 <div id="div2" class="detail">
 </div>
</div>

私のhtml5ブロックは上記のとおりです。私は、iphone、ipad、desktopのスタイルを設定するためにメディアクエリを使用しています。

レスポンシブデザインは初めてです。div1の画像サイズが変更されないようにスタイルを実装したいのですが、ブラウザウィンドウの幅を狭くすると、div2のテキストに含まれる内容を縮小する必要があります。

div2に%widthとmin-widthを指定しようとしても、div1に到達します。div2の横にとどまっているわけではありません。誰かが私にこれを書く方法を教えてくれるなら。それは大きな助けになります。

4

1 に答える 1

1

うん、これはかなり簡単に達成することができます。これがJSFiddleの例です。

HTML

<div id="div1" class="myimg"></div> 
<div id="div2" class="detail"></div>

CSS

.detail {
    overflow: hidden;
    min-height: 50px;
    border: 2px dashed black
}

.myimg {
    float: right;
    width: 250px;
    min-height: 50px;
    margin-left: 10px;
    border: 2px dashed red
}

これはあなたが達成したかったことですか?

于 2013-03-19T04:33:06.497 に答える