こちらのデモをご覧ください: http://jsfiddle.net/Freewind/Vkp4U/
html:
<div class="outer">
<div class="x">x</div>
<div class="y">y</div>
<div class="z">z</div>
</div>
CSS:
.outer {
border: 1px solid black;
overflow: scroll-x;
}
.x {
width: 400px;
border: 1px solid red;
float:left;
}
.y {
width: 400px;
border: 1px solid yellow;
float:left;
}
.z {
width: 400px;
border: 1px solid blue;
float:left;
}
ブラウザのサイズを小さくすると、3 つの内部 div が一列に表示されるようにするにはどうすればよいですか?
制限:
- 外側の div の幅は指定しないでください
- 内側の div の幅は固定されています