html - 更改最后一个 ul 元素的 float

Question

我有 float 问题。我正在做导航栏。它应该与左浮动内联，最后一项必须在行尾(右浮动)。

我试过 margin-left 但效果不好...

ul {
 position: static;
 list-style-type:none;
 margin-left:150px;
 margin-top: 11px;
 padding:0;
 overflow:hidden;
}

ul  li{
 float: left;
 margin-left: 30px;
}

ul li a{
 color: inherit;
 text-decoration: none;
 height: 72px;
 font-weight: bold;
 font-size: 19px;
 }

 ul li:last-child a{
  position: relative;
  margin-right: 0%;
 }

Answer 1

你应该 float 这最后一项，就像这样简单:

ul li:last-child {
    float: right;
}

JSfiddle:http://jsfiddle.net/PhilippeVay/eLLa4/ (当我没有看到它们在这个 fiddle 中有什么用时，删除了所有额外的声明，比如 child 的相对定位不移动顶部，右侧，底部或左侧......)

完整的 CSS:

ul {
 list-style-type: none;
 margin-left: 150px;
 margin-top: 11px;
 padding: 0;
 overflow: hidden;
}

ul li {
 float: left;
 margin-left: 30px;
}
 ul li:last-child {
  float: right;
}

ul li a {
 color: inherit;
 text-decoration: none;
 height: 72px;
 font-weight: bold;
 font-size: 19px;
}