前端的同学们,请教一个问题

2015-11-11 10:36:38 +08:00
 imdoge
http://codepen.io/imdoge/pen/dYQJBy?editors=110

描述:对 div.b 而言,父元素固定宽度,相对定位
自己绝对定位,宽度未知(宽度根据子元素宽度和)
子元素非 display:inline ({display:block;float:left;}或{display:inline-block;})
结果是自己的宽度被限定在父元素的宽度里了,导致子元素换行
(可以尝试一下把 div.a 的 relative 注释掉, div.b 不会换行,或者把 span 改为 display:inline , div.b 也不会换行)
请问这是什么原因?有什么办法能在父元素非 display:static ,固定宽度(且比较小),本身绝对定位,不能设固定宽度,子元素要有高度的情况下,实现子元素不换行的效果呢?
thanks~
1344 次点击
所在节点    问与答
3 条回复
Biwood
2015-11-11 10:48:42 +08:00
看的好累,现在的年轻人表达能力都差成这样了么。

你试试在 div.b 上面加个 white-space: nowrap;
IamJ
2015-11-11 10:59:30 +08:00
根据对你描述的勉强理解
.b 加上 white-space: nowrap;

另外 .b 设置了 float: left; 的话就没必要再设置 display: block; 多余
imdoge
2015-11-11 11:09:13 +08:00
@Biwood
@IamJ
感谢各位,没想到用这个样式,一般只有单行文本溢出显示省略号我才用这个,看来我不是很熟悉诶

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/235267

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX