Question

在firefox中，使用如下所示的换行符格式化代码时：

<div>
    <ul>
        <li>bullet</li>
        <li>bullet</li>
    </ul>
    <ul>
        <li>bullet</li>
        <li>bullet</li>
   </ul>
</div>

这些元素之间有空间。为了摆脱它，我必须将代码放在一行上，如下所示：

<div><ul><li>bullet</li><li>bullet</li></ul><ul><li>bullet</li><li>bullet</li></ul></div>

有没有办法通过一些CSS魔法避免这种情况？

编辑：我有一个重置css：

*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin:0;padding:0;border:0;font-size:100%;font:inherit;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{display:block;}
body{line-height:1;}
ol, ul{list-style:none;}
blockquote, q{quotes:none;}
blockquote:before, blockquote:after,q:before, q:after{content:'';content:none;}
table{border-collapse:collapse;border-spacing: 0;}

使用HTML5 doctype <!doctype html>

Answer 1

假设我理解你的问题，我最喜欢这样做：

ul { 字体大小：0 } ul li { font-size：10px }

以下是更多信息：http://css-tricks.com/fighting-the-space-between-inline-block-elements/

代码中的Firefox换行符会在元素之间创建间距

1 个答案: