边界定位:如何

Question

我想定位边框，但这不起作用。这是 CSS：

.menu-container {
    border-top: 5px solid #81806E;
    float: left;
    margin: 5px 27px 0 10px;
    width: 704px;
}

问题是这个容器包含菜单链接。因此，如果我调整宽度和边距，边框就会随之而来。但我想单独设置它...我该怎么做？

Answer 1

检查示例设计和代码以及结果，这是您想要的吗？

.HTML：

<div class="menu-container">
      <a class="menu-item" href="#">Menu 1</a>
      <a class="menu-item" href="#">Menu 2</a>
      <a class="menu-item" href="#">Menu 3</a>
      <a class="menu-item" href="#">Menu 4</a>
      <a class="menu-item" href="#">Menu 5</a>
    </div>

.CSS：

.menu-container {
    float: left;
    margin: 5px 27px 0 10px;
    width: 704px;
}
.menu-item{
  float:left;
  height:20px;
  margin-right:3px;
  border-top: 5px solid #81806E;
}

Answer 2

只需使用 p 标记或 span 即可列出菜单项。您希望在不移动边框的情况下移动带有边距的内容??.

您必须尝试将 .menu-container 的内容放在其他一些标签中，这样您的问题将得到纠正。