how to set height of list items in html?

Question

here my code-html

<div class="menu">
    <ul>
      <li class="active"><a href="index.html">HOME</a></li>
      <li class="active"><a href="#">COMPANY</a></li>
      <li class="active"><a href="#">SOLUTIONS</a></li>
      <li class="active"><a href="#">SERVICES</a></li>
      <li class="active"><a href="#">NEWS & EVENTS</a></li>
      <li class="active"><a href="#">BLOGS</a></li>
      <li class="active"><a href="#">CONTACTS</a></li>
    </ul>
  </div>

CSS

.header .menu ul { margin:33px 10px 0 0; padding:0; float:right; width:auto; height:12px; list-style:none;}
.header .menu ul li { margin:0 4px; float:left;}

it does not recognize the height feature???How can I set the height of menu item?

Answer 1

You're missing a semicolon :-)

You can also try setting the line-height property of the li tags to change the position of the text in the element.

Answer 2

.header .menu ul { margin:33px 10px 0 0; padding:0; float:right; width:auto;list-style:none;}
.header .menu ul li { margin:0 4px; float:left;}
.active{height:50px;}

Answer 3

ul is set to height 12px, at least in firefox. What browser are you having the trouble in?

Answer 4

Is the height set on the correct element? You're asking how to set the height of a menu item (presumably, an <li>) but your CSS says you're setting the height of the ul. Perhaps moving height: 12px; from where it is to ".header .menu ul li" would help.