ul CSS中的间距

时间:2018-07-01 00:01:31

标签: html css

我在一个网站上工作,但遇到CSS问题。 这是个小(大)问题:[编辑的图片]

problem of spacing

我要删除该空间.....(在第二个和第三个元素之间)

这是源代码:

nav {
  z-index: 100;
  background: url(../images/slider-bg.png) 0 0 no-repeat;
  margin: 0px 0px 0px 5px;
  height: 571px;
  overflow: hidden;
  padding: 0px;
}

ul.menu {
  margin: 0px 0px 0 0px;
  display: inline-block;
  padding: 30px;
}

ul.menu li {
  float: left;
  line-height: 20px;
  margin: 0px 5px 5px 5px;
}

ul.menu li a {
  font-size: 23px;
  line-height: 20px;
  font-family: 'Cabin Sketch', cursive;
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: -1px;
  display: block;
  margin: 0px;
  padding: 2px
}

ul.menu li:hover a,
ul.menu li.current a {
  color: #000;
}
<header>
  <h1 class="logo"><br/>
    <a href="index.php"><img src="images/logoPetit.png" alt=""></a>
  </h1>
  <nav>
    <div id="slide">
      <div class="slider">
        <ul class="items">
          <li><img src="images/slider-1.jpg" alt=""></li>
          <li><img src="images/slider-2.jpg" alt=""></li>
          <li><img src="images/slider-3.jpg" alt=""></li>
        </ul>
      </div>
      <a href="#" class="prev"></a>
      <a href="#" class="next"></a>
    </div>
    <ul class="menu">
      <li class="current"><a href="index.php" class="clr-1">Acceuil</a></li>
      <li><a href="projetPedagogique.php" class="clr-2">Projet pédagogique</a></li>
      <li><a href="vie.php" class="clr-3">Vie dans l'école</a></li>
      <li><a href="classe.php" class="clr-4">Classe</a></li>
      <li><a href="contacts.php" class="clr-5">Contact</a></li>
      <li><a href="gallery.php" class="clr-7">Gallerie</a></li>
    </ul>
  </nav>
</header>

我将html代码放在一个代码段中(我真的不知道它是什么),因为它似乎已执行。

请帮我!

1 个答案:

答案 0 :(得分:0)

请在此页面的左侧添加另一个属性text-align

ul.menu li a {
  font-size: 23px;
  line-height: 20px;
  font-family: 'Cabin Sketch', cursive;
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: -1px;
  display: block;
  margin: 0px;
  padding: 2px;
  text-align: left;
}