4つのdivで動作するCSSの浮動プロパティを取得する方法は？私は4つのdivを持っていますが、例としてレイアウトを使ってalginを取得したいのですが、
div One - div two
div Three - div Four
ここでは、私は次のCSSとHTMLコードを使用しようとしていますが、正しく整列していません。
<html>
<head>
<title>Layout Example</title>
<link rel="stylesheet" type="text/css" href="file:///C:/app3/css/custom-theme/jquery-ui-1.8.16.custom.css">
<script type="text/javascript" src="jquery-1.6.2.min.js"></script>
</head>
<body>
<div id="one" class="divs"> One </div>
<div id="two" class="divs"> Two</div>
<div id="three" class="divs"> Three </div>
<div id="four" class="divs"> Four </div>
</body>
</html>
ベストアンサー
#third 要素をすべて float：left および
clear：both （または clear：left ）
.divs
{
width: 200px;
height: 200px;
float: left;
}
#one
{
background-color: black;
color: white;
}
#two
{
background-color: blue;
}
#three
{
background-color: red;
clear: both;
}
#four
{
background-color: green;
}
もう1つの方法は、 #container を
height/width：400px の全体で作成し、 .divs
高さ/幅：50％：
<div id="container">
<div id="one" class="divs"> One </div>
<div id="two" class="divs"> Two</div>
<div id="three" class="divs"> Three </div>
<div id="four" class="divs"> Four </div>
</div>
#container {
width: 400px;
height: 400px;
}
.divs
{
width: 50%;
height: 50%;
float: left;
}
#one
{
background-color: black;
color: white;
}
#two
{
background-color: blue;
}
#three
{
background-color: red;
clear: left;
}
#four
{
background-color: green;
}