सीएसएस: एंकर ऊंचाई स्वीकार नहीं करेगा

Question

मैं इस पर एक घंटे से अधिक समय तक अपने बाल खींच रहा हूं और मैं समझ नहीं पा रहा हूं कि यह क्यों काम नहीं कर रहा है।

HTML:

<div id="mainmenu"> 
    <div class="menu"> 
     <ul> 
      <li class="page_item page-item-6"><a href="http://localhost/mysite/blog/">Blog</a></li> 
      <li class="page_item page-item-4 current_page_item"><a href="http://localhost/mysite/">Front Page</a></li> 
      <li class="page_item page-item-2"><a href="http://localhost/mysite/sample-page/">Sample Page</a></li> 
     </ul> 
    </div> 
</div> 

सीएसएस:

div#mainmenu { position: absolute; top: 40px; right: 0; font-size: 77%; } 
div#mainmenu div.menu ul, 
div#mainmenu div.menu ul li, 
div#mainmenu div.menu ul li a 
{ 
    height: 36px; 
} 
div#mainmenu div.menu ul { 
    display: table; 
    float: left; 
    width: 700px; 
    table-layout: fixed; 

    position: relative; 
} 
div#mainmenu div.menu ul li 
{ 
    display: table-cell; 
    padding: 0 10px; 
    overflow: hidden; 
} 
div#mainmenu div.menu ul li a 
{ 
    width: auto; 
    background: none; 
    margin: 10px auto; 
} 

Answer 1

बदलें div#mainmenu div.menu ul li a यह करने के लिए:

div#mainmenu div.menu ul li a 
{ 
    display: block; 
    width: auto; 
    background: none; 
    margin: 10px auto; 
} 

a तत्व डिफ़ॉल्ट रूप से inline हैं और आप इनलाइन तत्वों की ऊंचाई/चौड़ाई निर्धारित नहीं कर सकते हैं। ऊंचाई के बजाय

Answer 2

कोशिश लाइन ऊंचाई:

line-height:36px

http://jsfiddle.net/AlienWebguy/dP4F9/

Answer 3

एक कड़ी के लिए डिफ़ॉल्ट प्रदर्शन प्रकार इनलाइन है, जो ऊंचाई या चौड़ाई का जवाब नहीं है। इसके बजाय, अपने लिंक इनलाइन-ब्लॉक होने के लिए बताएं, जो लिंक के प्रवाह को बरकरार रखता है लेकिन उन्हें एक विशिष्ट आकार (ऊंचाई) होने के आपके अनुरोध का सम्मान करता है।

div#mainmenu div.menu ul li a 
{ 
    display:inline-block; 
    height:36px; 
}