Question

我是css和html中的新人我有三个<ol> <li>个标签。我想把每个新标签放在另一个标签下我使用z-index和相对位置，但它对我不起作用，每个新标签都在前一个标签上。如何使用css解决此问题。这是我的jsfiddle code

Answer 1

我想你想要这样的东西：

<强> jsBin demo

（很快我就看到你使用了border-left。）

.breadcrumb {
  position:absolute; /* this one will position your OL to the right */
  right:0;
  list-style: none; 
  overflow: hidden; 
}

.breadcrumb li{
  display:inline-block; /* align horizontally LI elements */
}

.breadcrumb li a {
  display:inline-block; /* allows to use paddings etc on inline elements */
  border-radius: 50px 0px 0px 50px;
  color: #fff;
  margin: 0 -20px 0 0;
  padding: 10px 22px 10px 30px;
  position: relative;
  text-decoration: none;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
  background-color: blue;
  border-left: 2px solid white;
}

基本上，

不，您根本不需要z-index。
您不需要float

如何将每个列表标签放在一起？

1 个答案: