CSS:如何阻止悬停效果推送我的文字?
我希望你理解这个问题,你可以在这里看到一个例子:
http://jsfiddle.net/nFbJY/
当您滚动他们移动的任何链接时:(
关于如何解决这个问题的任何建议?
HTML:
<div class="links">
<ul>
<li><a href="home.html">Home</a></li>
<li><a href="pricing.html">Pricing</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
CSS:
div.links {float: left; padding-top:15px;}
ul {list-style:none;}
li {float: left; margin: 0 .15em; padding: 3px 10px 3px 10px; border: 1px solid #CCC; border-radius: 5px; -moz-border-radius: 5px;}
a:hover { border: 1px solid blue; border-radius: 5px; -moz-border-radius: 5px; padding: 3px 10px 3px 10px; background-color:yellow;}
没有找到相关结果
已邀请:
6 个回复
靛新比比催
标签
公藕
这样你只能设置A标签的样式,而不是LI和A的样式。因此,不是效果堆叠导致2个元素上的填充/边框,而只是在一个元素上引起它。什么都没有被推开......
撕吠
邪罗逢确胃
元素而不是
琶竞捆栓
添加到
元素并将
添加到
。这样,按钮总是相同的宽度。或者,您可以使用
(或
)进行类似的操作。 编辑:在您的情况下,使用此CSS(尤其是最后2行):
际恃啸称桅
切换为
。 http://jsfiddle.net/nFbJY/3/