Accessibility

CSS Advisor

List numbers align at bottom in IE7

by amy_ok on December 26, 2006
Edited by: sfegette on November 28, 2009 Avg Rating 3.3 (6)   |   Log in to rate post.

Tagged with Position , Explorer 7.0 , vertical-align , ie7

Problem

When using ordered lists, the numbers drop to the bottom in IE7.

Solution

Add vertical-align:top; to li elements that are within an ordered list.

Detailed description 

ol li {vertical-align:top; }




Tagged with Position , Explorer 7.0 , vertical-align , ie7

Tag it on del.icio.us or Digg

Text ID: LIST_NUMBERS_ALIGN_AT_BOTTOM_IN_IE7


Comments (3)

To add a comment, please Log in.




Ordered lists in Internet Explorer 7

by Martin C. Bean on May 11, 2007

I've also noticed that ordered lists in Internet Explorer 7 seem to just have the number "1" for each list item instead of going up in number sequentially like normal. Anyone able to shed some light on this?

Helpful, with a catch

by CharlesBelov on May 4, 2007

Actually, this problem occurs with unordered lists as well. So
li {vertical-align:top; }
is even better. Thanks!

However, if line-height is set greater than 1em, say 1.25em, the dot appears higher than the text. I'm not sure what to do about that. It's still better than the dot or number rendering at the bottom.

I could not reproduce the error

by danielarce on December 28, 2006

Can you post some code that shows this in IE7? I could not reproduce it.

Daniel





CSS Advisor home
Submit a post

rss

CSS ADVISOR RSS FEEDS
Recent: POSTS | COMMENTS | EDITS


Browsers
Internet Explorer (45)
Mozilla/Firefox (16)
Opera (7)
Safari (13)
CSS Properties
Background (6)
Border (3)
Color (1)
Float (15)
Font (1)
Margin (6)
Padding (4)
Position (15)
Text (13)
Width/Height (9)