【问题标题】:centering (horizontally and vertically) <ul> in navbr div在导航 div 中居中(水平和垂直)<ul>
【发布时间】:2014-07-03 01:21:16
【问题描述】:

我知道这个问题之前已经解决了,但是在我的一生中,我无法让它与我的代码一起使用(是的,我是新手,所以请温柔,如果我是,请告诉我违反礼节!)。

基本上,尝试设置一个navbar,其链接垂直居中,悬停时会突出显示。
我通过观察它并调整margins / padding 来设置它,但肯定有更好的方法来解决这个问题。

另外,如何将链接水平居中?

这是相关代码。 http://jsbin.com/wekuqidu/1/

谢谢大家!!!!

【问题讨论】:

  • ul 放在要重新定位和重新定位该元素的元素中可能更容易。

标签: html html-lists centering


【解决方案1】:

这里是一个使用 line-height 的例子,你也可以尝试使用 table-cell 在中间垂直对齐

http://jsbin.com/nagoposu/2/

【讨论】:

  • 这很好用,谢谢帖木儿!!后续问题:如果我将#navbar a:hover 的字体粗细设置为粗体,我注意到悬停链接的所有内容都会略微向右移动;是什么原因造成的,我该如何解决?
  • 因为元素越来越宽,如果你给#navbar a 添加一些宽度,它就不会移动jsbin.com/nagoposu/3
猜你喜欢
  • 2011-10-25
  • 1970-01-01
  • 2015-08-29
  • 1970-01-01
  • 2016-11-27
  • 1970-01-01
  • 2014-11-22
  • 2015-09-16
  • 2012-12-16
相关资源
最近更新 更多