div同行显示_css如何让多个div盒子并排同行显示？

div盒子本身默认样式属性是独占一行，而解决div独占一行方法通常有两种，一种为设置浮动，另外一种为设置display样式。

一、使用css float并排显示

我们对div设置一个float浮动属性即可解决不并排显示，只要你的并排div盒子总宽度小于或等于最外层盒子宽度即可实现多个div对象并排显示。

div {float:left}

这里我们对div通设一个浮动，当然实际使用时候，要通排显示div对象的加入css类，我们就对要同行显示css选择器设置浮动。避免其它不需要设置的也被加入浮动样式。

二、使用css display同行显示

我们加入display:inline即可解决实现同行并排显示div盒子对象。

div {display:inline}

实例：

如果有三个div，分別为left , middle, right

而left与right的宽度是固定的，要依照不同的解析度将middle自动填满剩余的部分

做法如下

col3