div内部改为横向_DIV横向布局的几种方法

1.使用display: inline;将块级元素转变为行内元素：

CSS

.item-test{

border: 1px solid black;

padding: 7px;

cursor: pointer;

/*display: table-cell;*/

/*float: left;*/

width: 12px;

height:214px;

display: inline;

}

HTML

缺点：虽然可以做到横向布局，但是不能设置宽度和高度，padding和margin也是没有用，如果需要border就更加不堪入目：

而且，一旦你在使用了display：inline；的元素内添加块级元素，display：inline就会失效，变回块级元素的效果。

2. 使用display: table-cell;模拟table的元素：

这种方法比第一种方法要好很多，可以调是高度和宽度，padding也可以用，但是不能用margin(想想也明白，对td(table-cell就是模拟td)使用margin本来就不行)

.item-test{

border: 1px solid black;

padding: 7px;

cursor: poin

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！