V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
imdoge
V2EX  ›  问与答

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

  •  
  •   imdoge · 2015-11-11 10:36:38 +08:00 · 1343 次点击
    这是一个创建于 3106 天前的主题,其中的信息可能已经有所发展或是发生改变。
    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~
    3 条回复    2015-11-11 11:09:13 +08:00
    Biwood
        1
    Biwood  
       2015-11-11 10:48:42 +08:00   ❤️ 1
    看的好累,现在的年轻人表达能力都差成这样了么。

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

    另外 .b 设置了 float: left; 的话就没必要再设置 display: block; 多余
    imdoge
        3
    imdoge  
    OP
       2015-11-11 11:09:13 +08:00
    @Biwood
    @IamJ
    感谢各位,没想到用这个样式,一般只有单行文本溢出显示省略号我才用这个,看来我不是很熟悉诶
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2875 人在线   最高记录 6547   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 15:37 · PVG 23:37 · LAX 08:37 · JFK 11:37
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.