1
rayps 2015-03-10 17:20:04 +08:00
.list-details .block-now, .list-details .block-next{
/* display: inline-table; */ float: left; } |
2
gangsta 2015-03-10 17:24:32 +08:00
第二个加float: left;
|
3
NemoAlex 2015-03-10 17:25:15 +08:00
.list-details .block-now, .list-details .block-next {
} |
4
NemoAlex 2015-03-10 17:25:53 +08:00
Sorry, 不小心提交了
.list-details .block-now, .list-details .block-next { vertical-align: top; } |
5
wwwap 2015-03-10 17:25:56 +08:00
@mixin inline-block-fix($element) {
font-size: 0; > #{$element} { display: inline-block; vertical-align: top; } } |
6
franciscowxp 2015-03-10 17:26:41 +08:00
.list-details .block-now, .list-details .block-next {
vertical-align:middle;//add } |
7
romoo 2015-03-10 17:27:47 +08:00
设置 vertical-align
|
8
belin520 2015-03-10 17:32:27 +08:00
设置 vertical-align ,就是设置表格的对齐方式
那么多人回复了,哈哈 |
9
loveuqian 2015-03-10 18:06:17 +08:00
搭车求解为什么加了float left就对齐了
|
10
breeswish 2015-03-10 18:32:01 +08:00
@loveuqian float:left 会导致其按照浮动布局来布局(display 不再 inline),和 inline-block 已经没有关系了
写加 float:left 是相同结果的另一种途径,却不是楼主途径的正确修正 |
11
loveuqian 2015-03-10 18:35:22 +08:00
@breeswish 没看懂,感谢回答,新手学css的基础的几个难点估计就在float,position,display,
|
12
b821025551b 2015-03-10 18:59:08 +08:00
@loveuqian 反正float属性很恶心就是了,能不用,就不用。
|
13
loveuqian 2015-03-10 21:19:13 +08:00
@b821025551b 能不用就不用的话问一下最基本的两列布局的话,难道要用position嘛?
|
14
sunhk25 OP 解决》》http://jsfiddle.net/mDdKr/404/
/* float: left; */ /* 仅加这个也OK */ /* vertical-align: top; */ /* 仅加这个也OK */ vertical-align:middle; /* 仅加这个也OK,这个我最喜欢 */ @rayps @gangsta @NemoAlex @wwwap @franciscowxp @romoo @belin520 @loveuqian @breeswish @b821025551b 谢谢各位 |
15
juicy 2015-03-11 17:43:52 +08:00
本来table布局中有些东西就非常不直觉化,一般能避免用table就不用table,楼主都用div了竟然还把它们硬生生地套用成table。。。用display:inline-block应该既能实现楼主的期望,同时由不会引入楼主遇到的问题。
另外,我研究了一下规范,找到为什么会出现demo中的奇怪现象的原因了。 详见博文 http://melon.github.io/blog/2015/03/11/a-quirk-table-case/ |
16
sunhk25 OP |