Question

我有一个<nav>，当我添加float:right属性时，如果我没有3px，它会在顶部添加margin左右float {1}}，一切正常。

这是代码

<nav>
<ul>
<li ><a href="#">UBICACION</a></li>
<li><a href="#">RESERVAS</a></li>
<li class="boton_chico"><a href="#">FOTOS</a></li>
</ul>
</nav>

和CSS

 nav {
    width:100%;
    height:70px;
    background-color:#000;
    }

ul{ margin-top:0;}

ul li {
    font-family:'Gotham-narrow-light-botonera';
    list-style-type:none;
    }

ul li a {
    text-decoration:none;
    color:#FFF;
    width:190px;
    height:10px;
    font-size:2em;
    text-align:center;
    margin-top:0;
    padding:0;
    float:right;
    margin-top:15px;
    }

ul li.boton_chico a{
    width:130px;
    text-align:center;
    }

body {
    background:url(imagenes/subtle_carbon.png) repeat;
    background-attachment:fixed;
    background-color:#111;
    margin:0; padding:0;
    }

谢谢。

Answer 1

此处您需要的是基本重置，例如Reset

因为默认情况下，ul等某些元素具有margin或padding等属性。此外，您可以使用*匹配所有元素的最基本的重置：

* {
  margin:0;
  padding:0;
  border:0;
}

在此处查看使用您的代码制作的演示<strong> http://jsfiddle.net/vy9ME/2/

PD：推荐在CSS开头重置

Answer 2

边距折叠除非有其他标记在元素之间放置空格，例如填充... http://reference.sitepoint.com/css/collapsingmargins

将规则 * {padding：0px} 添加到css以检查是否存在问题。如果是，您可以更具体地定位元素。我怀疑罪魁祸首是UL标签。使用chrome的inspect元素工具，您可以突出显示代码，它将显示每个元素的填充，边框，边距。

如何删除浮动边距或填充？

2 个答案: