Navigation 导航按钮的跨距宽度

Navigation 导航按钮的跨距宽度,navigation,width,html-lists,css-transitions,html,Navigation,Width,Html Lists,Css Transitions,Html,我有一个导航包含内联块李。每个li包含两个块跨度元素,因此它在滚动时设置动画。我的问题是li导航的中心对齐和间距。我不想给li标签一个最小宽度。有人能帮忙吗 HTML: position:absolute正在li span下创建此问题。您需要删除它,然后将负片top应用于此css,从而获得效果 比如说, li span { display: block; position: relative; top: -15px; -webkit-transition: top 0.3

我有一个导航包含内联块李。每个li包含两个块跨度元素,因此它在滚动时设置动画。我的问题是li导航的中心对齐和间距。我不想给li标签一个最小宽度。有人能帮忙吗

HTML:


position:absolute
正在
li span
下创建此问题。您需要删除它,然后将负片
top
应用于此css,从而获得效果

比如说,

li span {

   display: block;
   position: relative;
   top: -15px;
  -webkit-transition: top 0.3s, border 0.3s, color 0.35s;
  -moz-transition: top 0.3s, border 0.3s, color 0.35s;
  -ms-transition: top 0.3s, border 0.3s, color 0.35s;
  -o-transition: top 0.3s, border 0.3s, color 0.35s;
  transition: top 0.3s, border 0.3s, color 0.35s;
}
这是你的电话号码


希望这能有所帮助。

如果您对解决方案感到满意,您可以通过绿色勾选和向上投票来接受它。谢谢-@user1910388是的,已经修好了,非常感谢!
#nav {
height: 25px;
border-top: 2px solid #FFFFFF;
border-bottom: 1px solid #C7C7C7;
padding: 10px 0px 5px 0px;
text-align: center;


}

#nav li{
height: 16px;
line-height: 15px;
overflow: hidden;
display: inline-block;
padding: 0px 25px 0px 25px;
position: relative;
}

li span.top {
color: #16528e;
top: -18px;

}

a:hover span {
top: 18px;
}
a:hover span.top {
top: 0;
}

li span {
display: block;
top: 0;
position: absolute;
  -webkit-transition: top 0.3s, border 0.3s, color 0.35s;
  -moz-transition: top 0.3s, border 0.3s, color 0.35s;
  -ms-transition: top 0.3s, border 0.3s, color 0.35s;
  -o-transition: top 0.3s, border 0.3s, color 0.35s;
  transition: top 0.3s, border 0.3s, color 0.35s;
}
li span {

   display: block;
   position: relative;
   top: -15px;
  -webkit-transition: top 0.3s, border 0.3s, color 0.35s;
  -moz-transition: top 0.3s, border 0.3s, color 0.35s;
  -ms-transition: top 0.3s, border 0.3s, color 0.35s;
  -o-transition: top 0.3s, border 0.3s, color 0.35s;
  transition: top 0.3s, border 0.3s, color 0.35s;
}