Anne, On Nov 24, 2006, at 9:15 AM, Anne Davies wrote:
> I've been working for ages now on this vertical horizontal menu in > css and > have slowly managed to improve it apart from a couple of things. It > works > great in IE but in Firefox it sits too far to the right, as if there's > padding to the left. ... The dropdown in Firefox isn't perfect but > I could live with it. > http://www.aberdeenhq.com/test/ First, Don't re-invent the wheel unless you are using the process as a learning tool. Check out <http://css.maxdesign.com.au/listamatic/> for many navigation examples. Second, Make sure your html and css validate. Invalid code can cause browsers to do very odd things. Third, If you do your initial implementation in a standards compliant browser (firefox, opera, konqueror or one of their cousins) you will have less work in the end. Fourth, Mozilla/Firefox's DOM Inspector is a great debugging tool. Fifth, I think your html and css could be much simpler and achieve the same result. The problems you are seeing are the result of over specifying the layout. In other words, the css is telling the browser to do things that contradict each other. Your specific problem is caused by the fact that ie adds margin to the li to make room for the list bullet while firefox and others add padding to the ul to make room for the bullets. If you add padding: 0; to #menuh ul the extra space will go away, but it will reveal other problems. Understanding how css works and how browsers implement it has a definite learning curve. If it would help, I could code up a sample of your page. -- Roger Roelofs "Remember, if you’re headed in the wrong direction, God allows U-turns!" ~Allison Gappa Bottke ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
