1

スタイルを使用して、2つのdivをWebアプリケーションに並べて配置します。たとえば、stackoverflowの左側の部分には、そのようなものがあります。私はのように試しました

<div style="width:60%; " >

</div>

  <div style="width:40%; ">    

</div>

しかし、divは別のdivの次の行に来るので、divを60％と40％の幅で並べて表示します。手伝って頂けますか

4

2 に答える 2

2

両方のdivに追加float:leftすると、機能するはずです

デモ： http： //jsfiddle.net/JvBJT/

于 2012-09-05T09:55:58.103 に答える
0

私は物事を整列させるためにフロートを使用することに熱心ではありませんが...あなたはこれを行うことができます...これは画面を2つのdiv要素（フレームに少し似ています）に分割します

<!DOCTYPE html>
<html>
    <head>
        <title>Template</title>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <style type="text/css">
            html, body
            {
                /* height: 100%; removed as per user comments */ 
            }

            .div1
            {
                background: none repeat scroll 0 0 #FF0000;
                display: inline-block;
                /* height: 100%; removed as per user comments */ 
                width: 60%;
                float: left;
            }

            .div2
            {
                background: none repeat scroll 0 0 #0000FF;
                display: inline-block;
                /* height: 100%; removed as per user comments */ 
                width: 40%;
                float: left;
            }
        </style>
    </head>
    <body>
        <div class="div1">
            I am Div1 and this is my content<br/>
            I am Div1 and this is my content<br/>
            I am Div1 and this is my content<br/>
            I am Div1 and this is my content<br/>
            I am Div1 and this is my content<br/>
        </div>
        <div class="div2">
            I am Div2 and this is my content<br/>
            I am Div2 and this is my content<br/>
            I am Div2 and this is my content<br/>
            I am Div2 and this is my content<br/>
            I am Div2 and this is my content<br/>
            I am Div2 and this is my content<br/>
            I am Div2 and this is my content<br/>
            I am Div2 and this is my content<br/>
            I am Div2 and this is my content<br/>
            I am Div2 and this is my content<br/>
            I am Div2 and this is my content<br/>
        </div>
    </body>
</html>
于 2012-09-05T10:00:20.357 に答える