html使div内部元素水平排列,如何使三个div水平排列

最新推荐文章于 2023-06-07 09:24:16 发布

伦敦交易员

最新推荐文章于 2023-06-07 09:24:16 发布

阅读量2.2k

点赞数

文章标签： html使div内部元素水平排列

trying to make three divs line up. heres what I'm working with

About

Contact

F.A.Q.

I've tried making the css for each of the sub_cat's be float: left, center, and right respectively, but for some reason they wont line up

解决方案

There are many methods, but the most manageable way to get just a horizontal layout is to display the inner div elements as table-cell:

div#final_space>div {

display: table-cell;

}

Note that the selector above is more usable than trying to class the inner div elements.

To spread them out evenly takes a little more work. You need to change the display of the container div.

div#final_space {

display: table;

width: 100%;

table-layout: fixed;

}

This works in all current browsers, even IE8.

div#final_space>div {

display: table-cell;

/* For visibility only: */

text-align: center;

border: thin solid #999;

}