On 10 Aug 2006, at 8:10 am, Ian Piper wrote:
> I have just done an update of a site and have noticed something
> strange. The menu buttons on the left navigation look fine on Safari
> and IE but not on Firefox: the vertical spacing in Firefox is about
> twice what it should be.
>
> http://www.bizzytots.com/
>
> I'm sure it's something simple but another pair of eyes would be
> really useful.
>
I thought someone might like to know the outcome of this problem. It
was rather odd. Thanks to David Sharp who put me onto the solution.
It turned out that the problem was partly that I was interrupting an
unordered list with some non-list items(using h4 as a descendant of
the unordered list). Like this:
<ul id="mainNav">
<h4>title1</h4>
<li>item</li>
<li>item</li>
<li>item</li>
<h4>title2</h4>
<li>item</li>
<li>item</li>
</ul>
Anyway, I changed the identifier from id to class and made 4
unordered lists instead of 1, and also made the h4 a descendant of
the container div rather than the ul.
<h4>title1</h4>
<ul class="mainNav">
<li>item</li>
<li>item</li>
<li>item</li>
</ul>
<h4>title2</h4>
<ul class="mainNav">
<li>item</li>
<li>item</li>
</ul>
The other component to the problem was that I had a general
definition at the top of my css to catch all unordered lists and that
was putting an unwanted green square to the left of my navigation
menu, outside the page margin. I redefined that identifier to
ul.page_bullets and changed the reference wherever I needed a
bulleted list.
Thanks for your help,
Ian.
--
Dr Ian M Piper
[EMAIL PROTECTED]
skype: ianmpiper
--
Where is the wisdom we have lost in knowledge?
Where is the knowledge we have lost in information?
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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/
