rabbbit
V2EX  ›  CSS

小白问题,关于 CSS inline-block 在 chrome 下的显示问题

  •  
  •   rabbbit · Nov 3, 2017 · 3409 views
    This topic created in 3150 days ago, the information mentioned may be changed or developed.
    使用 display: inline-block 布局,chrome 和 firefox| ie 显示不同.
    卡壳了,想不通为啥 chrome 这里不一样?

    chrome 62


    firefox


    ie


    [html 代码]( http://htmlpreview.github.io/?https://github.com/Aaron-Bird/baiduIFE/blob/master/xiaowei_mission_3/index.html)
    1 replies    2017-11-03 15:21:50 +08:00
    noe132
        1
    noe132  
       Nov 3, 2017   ❤️ 1
    你的 #gallery 有 20px 的 padding,还有 1px 的 border,设置 width 成 120px,content 实际的宽度只有 120 - 20*2 - 1*2 = 78,而你的内容有 80px,所以就会出现横向滚动条。

    解决办法:加 2 个 px 的宽度


    放大 8 倍就能发现右边少了 1 个 px

    浏览器差异:那得问浏览器厂商
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   2578 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 36ms · UTC 08:28 · PVG 16:28 · LAX 01:28 · JFK 04:28
    ♥ Do have faith in what you're doing.