CSS/HTML vertical alignment of links in horizontal navigation bar -

निम्न कोड को देखते हुए:

  HTML: & lt; div id = "nav_bar" & gt ; & LT; ul & gt; & Lt; li & gt; & lt; a href = "#" वर्ग = "चालू" & gt; होम & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "#" & gt; गैलरी & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "#" & gt; पीना & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "#" & gt; खाओ & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "#" & gt; LOCATION & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "#" & gt; संपर्क & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "#" & gt; & lt; img वर्ग = "ध्वज" src = "चित्र / italy_flag.png" alt = "" / & gt; & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "#" & gt; & lt; img वर्ग = "ध्वज" src = "चित्र / uk_flag.png" alt = "" & gt; & lt; / a & gt; & lt; / li & gt; & Lt; li & gt; & lt; a href = "#" & gt; & lt; img वर्ग = "ध्वज" src = "चित्र / spain_flag.png" alt = "" /> & lt; / a & gt; & lt; / li & gt; & Lt; / ul & gt; & Lt; / div & gt; सीएसएस: # एनएवी_बार {चौड़ाई: 745 पीएक्स; ऊँचाई: 20px; पृष्ठभूमि छवि: यूआरएल (../ छवियों / bkg_nav_bar_02.png); मार्जिन: 5 पीएक्स ऑटो; -moz-बॉर्डर-त्रिज्या: .3em; -webkit-बॉर्डर-त्रिज्या: .3em; } #nav_bar ul {list-style: none; text-align: केंद्र; } #nav_bar {text-decoration: none; font-size: .8em; मार्जिन: 0 10px; फोंट की मोटाई: बोल्ड; रंग: # FFFF33; } #nav_bar li {display: inline; margin-bottom: 3px; }। फ्लाग {स्थिति: रिश्तेदार; सही नाव; सीमा: कोई नहीं; मार्जिन टॉप: 4px; मार्जिन-सही: 10px; }  

पाठ लिंक सही ढंग से सफारी और क्रोम में गठबंधन कर रहे हैं और इसलिए छवि लिंक हैं, लेकिन फ़ायरफ़ॉक्स (3.5) में पाठ लिंक्स स्थिति से थोड़ी दूर हैं, नीचे की तरफ । क्यूं कर?

छवि के आकार की तरह लग रहा है पाठ के आकार की तुलना में थोड़ा बड़ा है। सीएसएस में ली की ऊंचाई को मजबूर करने की कोशिश करें।