实现两个div并排的三种方式-创新互联

首先说明一下，本人是初学者，只是把自己遇到的一些问题的解决方法做一个记录，方便查阅。

创新互联建站是网站建设技术企业，为成都企业提供专业的做网站、成都做网站，网站设计，网站制作，网站改版等技术服务。拥有十载丰富建站经验和众多成功案例，为您定制适合企业的网站。十载品质，值得信赖！

一直觉得要使2个div并排是一件特别简单的事，不就是float左边的div吗，后来在实际的应用中遇到问题，改了很多遍才，深刻悟出一个道理，看似简单的东西对我来说其实也不简单，还需要多思考。比如按上述说float左边div是可以，但是在我两边div的高度都不可控又要保持同样高度的情况下，就特别麻烦，所以，我自己总结出了3个方法，如果各位还有其它的方法，欢迎多分享。

1.float

　　　　设置好两个div的宽度和高度，在左边div里面加上float:left即可。

　　2.margin-left

　　　　给外层div设置一个宽度，设置右边div的高度，然后用margin-left:200px,在左边空出来的200px宽度范围内就可以放左边的div，要把左边div的position设置为absolute.

　　　　如例子：

 　　　　css如下：

.content1{ width:1000px; margin:0 auto; background:#FF69B4; } .leftDiv1{ position:absolute;; } .rightDiv1{ background:#FFC0CB; height:100px; margin-left:200px; }

 　效果如下：

3.Table

用table来布局，一个tr里面的两个td里面分别放左右两个div，好处就是左右td的高度看起来一样高

文章标题：实现两个div并排的三种方式-创新互联
链接URL：http://wjwzjz.com/article/ijopd.html