1

これは私のCSSです：

  header {
    hgroup {
      background: #1F1E1E;
      height: 100px;

      padding: 0px;
      margin: 0px;

      color: #FEFFFE;

      font-family: Arial, Helvetica, sans-serif;
      font-size: 1em;

      h1,h2 {
        padding: 0px;
        margin: 0px;
      }
    }

    nav {
      background: #FEFFFE;
      height: 60px;

      padding: 0px;
      margin: 0px;

      -webkit-box-shadow: 0px 2px 1px rgba(50, 50, 50, 0.2);
      -moz-box-shadow:    0px 2px 1px rgba(50, 50, 50, 0.2);
      box-shadow:         0px 2px 1px rgba(50, 50, 50, 0.2);

      ul {
        list-style: none;
        padding: 0px;

        li {
          float: left;
          padding: 20px 30px 20px 0px;
        }
      }
    }
  }

そして、これは私のHTMLです:

<header>
    <hgroup>
        <h1>Lorem Ipsum</h1>
        <h2>Lorem ipsum dolor sit amet.</h2>
    </hgroup>
    <nav>
        <ul>
            <li><a href="#">Home</a></li>
            <li><a href="#">Products</a></li>
            <li><a href="#">Contact</a></li>
            <li><a href="#">About</a></li>
        </ul>
    </nav>
    <div class="clearfix"></div>
</header>

最終結果は次のとおりです。

ここに画像の説明を入力

ご覧のとおり、hgroupとnavタグの間に隙間があります。私はそれを削除する方法を理解できないようです。私はすでに、それを取り除くと思われるほぼすべての場所に置いpadding: 0px;たり、取り付けたりしようとしましたが、役に立ちませんでした. margin: 0px;私に何ができる？

私のCSSがそのような構造になっている理由を尋ねているなら、それは私がLESSを使用しているためです。

4

1 に答える 1

0

あなたのULにはマージンがあるかもしれません、それに追加margin:0してみてください:)

于 2012-10-16T05:44:44.467 に答える