CODEWITHSUNDEEP

cssmarginhtml-lists

Vyacheslav Loginov

Reputation: 3216

CSS: li > a margin

#top-menu ul.menu li {
  background: url(img/back-top-menu2.png);
  width: 70px;
  height: 37px;
  cursor: pointer;
  float: left;
  text-align: center;
}

#top-menu ul.menu li:hover {
  background: url(img/back-top-menu.png);
}

#top-menu ul.menu li a { 
  color: #fff;
  text-decoration: none; 
  list-style-type: none;
  text-align: center;
  margin-left: 20px;
  margin-top: 20px;
}

enter image description here

How to make margin-top works?

Upvotes: 0

Views: 383

Answers (2)

Moin Zaman

Reputation: 25445

try padding-top instead.

The other way is to add display:block and then give it also a height of 37px, and then add a line-height:37px

Upvotes: 2

Leo Jiang

Reputation: 26095

<a> is an inline element. Add "display:block;" or "display:inline-block;" to it to make it a block level element. Properties like "margin" and "padding" only work on block level elements.

Upvotes: 5

Related Questions