Email conversation
| From | Charles Bowman |
|---|
| To | Me |
|---|
| Subject | Pure CSS Menus - Links in Top Level |
|---|
| Date | 23 August 2005 16:29 |
|---|
I have been using your tutorial on pure CSS menus
(http://www.howtocreate.co.uk/tutorials/testMenu.html) to create one
of my own that is compatible with IE5+ (and of course the other more
compliant browsers). Everything works fine until I try to add links to
the menu items on the top level (like lips, ears, etc. on your
example). Once I add links, IE starts to act funny durring a
mouse-over: it expands the menu downwards. What is more confusing is
that this does not happen on the child links, just links on the top
level. What is going on here and can it be corrected?
Thanks,
Charles Bowman
| From | Me |
|---|
| To | Charles Bowman |
|---|
| Subject | Re: Pure CSS Menus - Links in Top Level |
|---|
| Date | 23 August 2005 17:27 |
|---|
Charles,
Sorry, not got time to investigate just this minute, but this sounds like
the IE block-elements-in-lists bug:
http://www.howtocreate.co.uk/wrongWithIE/?chapter=Empty+Elements
try setting display:inline; on the LIs (only on the ones with links in them)
- it will have no effect on the other browsers, but it will fix IE. (In
theory, it should do nothing at all, but then, nothing IE does makes much
sense.)
Mark 'Tarquin' Wilton-Jones - author of http://www.howtocreate.co.uk/
| From | Charles Bowman |
|---|
| To | Me |
|---|
| Subject | Re: Pure CSS Menus - Links in Top Level |
|---|
| Date | 23 August 2005 18:21 |
|---|
Thanks - It finally worked by changing the line at the bottom of the CSS
file:
ul.makeMenu li a { color: #99ff33; display: inline; width: 100%;}
from:
ul.makeMenu li a { color: #99ff33; display: block; width: 100%;}