这是一个创建于 3886 天前的主题，其中的信息可能已经有所发展或是发生改变。
第 1 条附言 · 2014-04-15 17:43:33 +08:00
经@P233指点已经找到正解
第 2 条附言 · 2014-04-15 20:20:36 +08:00
 |
1
yushiro 2014-04-15 16:51:22 +08:00
参考： http://www.html5rocks.com/zh/tutorials/flexbox/quick/#toc-center
弹性方框模型 (Flexible Box Model) 快速入门 |
 |
2
xiaomajia008 2014-04-15 16:57:07 +08:00
哎,用js可以轻易实现...
|
 |
4
hourui OP @xiaomajia008 在布局上，我还是倾向于css，尽量避免用js去适应布局。
|
 |
5
zzNucker 2014-04-15 17:00:40 +08:00
我也好想用flexbox啊。。。。。。 太蛋疼了。
|
 |
6
westup 2014-04-15 17:02:08 +08:00
腾讯那题啊，表示当时也卡在那里了，愧为老前端
|
 |
7
crs0910 2014-04-15 17:04:52 +08:00
外面 div 相对定位，里面两个 span 绝对定位，一个 left:0 ，一个 right:0 ，right那个加个background。
|
 |
9
romoo 2014-04-15 17:08:31 +08:00
|
 |
10
P233 2014-04-15 17:09:27 +08:00
这个不需要 flexbox ，更不用 js
#right float:right;width:auto #left 不设定浮动，margin-right: auto 注意，markup 里 #left 一定要在 #left 的前面 |
|
11
P233 2014-04-15 17:10:00 +08:00
打错了，HTML #right 要在 #left 前面
|
|
12
romoo 2014-04-15 17:10:41 +08:00
我的方法需要将 #left 和 #right 的位置换一下。
|
|
15
P233 2014-04-15 17:31:43 +08:00
|
|
19
P233 2014-04-15 17:41:51 +08:00
@hourui 截图里面 #left 继承了 inline-block，而且 markup 里有 whitespace 所以有 2px 的额外 margin
在 markup 里 <span></span><span></span><span></span> 然后 display: inline-block 不会有间距问题 但是如果 <span></span> <span></span> <span></span> 就有间距了 |
 |
21
emric 2014-04-15 19:29:06 +08:00
这不是又一个变样的 BFC ?
|
|
22
hourui OP @emric 学习了一下BFC这个词。的确这是一个BFC
看到个不错的帖子介绍BFC http://www.cnblogs.com/pigtail/archive/2013/01/23/2871627.html |
Select Language