是否可以将两个div元素并排而不使用CSS float？ [英] Is it possible to put two div elements side-by-side without using CSS float?

问题描述

我不断发现，当我使用CSS float在页面上并排放置两个元素时，IE和Firefox会做奇怪的事情。

I keep finding that IE and Firefox do strange things to surprise me when I use CSS float to put two elements side-by-side on a page.

可以在网页上并排使用两个div而不使用CSS float？

Is it possible to have two divs side by side on a web page without using CSS float?

<div id='div1'>
<p> div1 p1 </p>
<p> div1 p2 </p>
</div>
<div id='div2'>
<p> div2 p1 </p>
<p> div2 p2 </p>
</div>

推荐答案

>

You could do it with absolute positioning.

<div id="container">
<div id='div1'>
<p> div1 p1 </p>
<p> div1 p2 </p>
</div>
<div id='div2'>
<p> div2 p1 </p>
<p> div2 p2 </p>
</div>

并示例CSS。

#container {
position: relative;
width: 800px;
}
#div1, #div2 {
position: absolute;
width: 400px;
}
#div1 {
left: 0;
}
#div2 {
left: 400px;
}

这篇关于是否可以将两个div元素并排而不使用CSS float？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！