Jump to content


Photo

Help with whitespaces (gaps) between <li> list objects in IE


  • Please log in to reply
6 replies to this topic

#1 dannel77

dannel77
  • Members
  • PipPip
  • Member
  • 22 posts

Posted 03 August 2006 - 12:29 AM

The list looks fine in Firefox, but in IE there are som gaps between the
lines, the list is an ordinary: <ul><li> unordered list..

I'm trying to make the lists look identical in both browsers but it's much more compact in Firefox, and in IE there appears to be some "padding" or something around every textstring.. Have searched the net for a solution and heard of this bug in IE, does somene here have a solution for this problem?

The CSS file look like this right now:

li{list-style: disc; }
li{margin: 0; padding: 0;}


#2 nogray

nogray
  • Members
  • PipPipPip
  • Advanced Member
  • 930 posts
  • LocationSan Francisco CA

Posted 03 August 2006 - 12:45 AM

try this
ul, ol, li{margin: 0; padding: 0;}

NoGray.com


#3 dannel77

dannel77
  • Members
  • PipPip
  • Member
  • 22 posts

Posted 03 August 2006 - 10:19 AM

Have tried it now, but it makes now difference, the space between the lines are still there.. and the list is much
more compact in Firefox..

#4 wildteen88

wildteen88
  • Staff Alumni
  • Advanced Member
  • 10,482 posts
  • LocationUK, Bournemouth

Posted 03 August 2006 - 10:39 AM

Do you have paragraph tags (<p></p>) or line break tags (< br>) inside the list tags (<li></li>)? If you do take them out. Also could you post your html code for your list here too.

#5 dannel77

dannel77
  • Members
  • PipPip
  • Member
  • 22 posts

Posted 04 August 2006 - 09:38 AM

No, I have no <p> or <br> within the tags, but I found out today that if I set the font size to 1, the lists look almost the same in IE anf FF.. But since I use a fixed size of 10px IE can't "delete" the whitespace in between.. and the list is as compact with size 1 as with a font size of 10 px.. :-\

#6 AndyB

AndyB
  • Staff Alumni
  • Advanced Member
  • 5,465 posts
  • LocationToronto

Posted 04 August 2006 - 10:31 AM

Then either what you see is the way those browsers work or you can try fixing the line-height with extra CSS.

li { line-height:120%;}
Legend has it that reading the manual never killed anyone.
My site

#7 dannel77

dannel77
  • Members
  • PipPip
  • Member
  • 22 posts

Posted 04 August 2006 - 10:41 PM

Thanx a million man!! Worked fine with a line-height of 150%, now the lists look the same in IE and FF!  :)




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users