时间戳

首页 > 解决方案 > ul CSS 中的间距

html - ul CSS 中的间距

问题描述

我在一个网站上工作，我有一个 CSS 问题。这是小（大）问题：[编辑图片]

间距问题

我想删除那个空间.....（在第二个和第三个元素之间）

这是源代码：

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 代码放在一个片段中（我真的不知道它是什么），因为它显示为已执行。

请帮帮我！

标签： htmlcss

解决方案

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;
}

推荐阅读