V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
Can I use?
http://caniuse.com/
Less
http://lesscss.org
Cool Libraries
Bootstrap from Twitter
Jetstrap
kmvan
V2EX  ›  CSS

关于不换行显省略号(这是 IE bug 还是我的 css 写错了?)

  •  
  •   kmvan · 2014-11-13 23:54:27 +08:00 · 4104 次点击
    这是一个创建于 3664 天前的主题,其中的信息可能已经有所发展或是发生改变。

    先上地址: http://jsfiddle.net/8r6eooy9/1/

    补图 http://ww2.sinaimg.cn/large/686ee05djw1em9t7dfzc9j209s04t74h.jpg

    情况说明:ul>li>a 结构中,显示 ullist-type-style(圆点),并且 a 填充整行,但不换行,溢出的显示 […] 省略号。

    预期效果:圆点a 应该在同一行。

    实际情况:在 IE11(或安卓444自带浏览器)下,圆点成为了第一行,a 被挤下去了。ffchrome 无此问题。

    猜测原因:不知道。

    请大神们看看这是什么情况?理论上 css 应该没错,但 ie11 出现了换行情况,求支招~

    2 条回复    2014-12-05 12:54:07 +08:00
    anjianshi
        1
    anjianshi  
       2014-11-14 08:02:48 +08:00
    是 overflow: hidden; 这句导致的问题,原因不明

    这有一个勉强可用的实现方式:
    ul{ }
    li{
    list-style-position: inside;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 15em;
    }
    a{ }

    缺点是, IE 和 Chrome 下,显示出来的字数是不一样的
    但至少可以正常截断字符了
    thanksmymagic
        2
    thanksmymagic  
       2014-12-05 12:54:07 +08:00
    @anjianshi Hi~你好,我是笪兴,十年后(10years.me)的创始人。我刚刚看到你的一些回答,感觉和我们的技术和团队风格都挺合拍 ,希望可以聊聊。十年后是一个基于梦想的社交网络,我们想用它让年轻人的生活更有未来性,网站是去年年末上线的。我们上个月刚拿到创新谷VC百万元天使轮融资,现在在招募Web前端开发的人才。可以加我的微信18101620531聊聊,交个朋友也不错:)
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1058 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 28ms · UTC 18:36 · PVG 02:36 · LAX 10:36 · JFK 13:36
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.