IE Shows Spaces Between Boxes

Hello,
IE shows spaces between a few boxes made of ul-li elements in CSS
unlike Firefox. I tried padding/margin in different places but cannot
fix it. The URL is http://www.vunet.us/wic/test/ztop.asp, see pop-up
menu over link "My Test"
Please, recommend a fix for IE. The menu keeps disappearing because of
the gaps (spaces) when moving mouse up and down.
Thanks.

vunet.us [ Mi, 07 November 2007 15:30 ] [ ID #1865214 ]

Re: IE Shows Spaces Between Boxes

VUNETdotUS wrote:

> Hello,
> IE shows spaces between a few boxes made of ul-li elements in CSS
> unlike Firefox. I tried padding/margin in different places but cannot
> fix it. The URL is http://www.vunet.us/wic/test/ztop.asp, see pop-up
> menu over link "My Test"
> Please, recommend a fix for IE. The menu keeps disappearing because of
> the gaps (spaces) when moving mouse up and down.

Since this is an 'on hover' effect only, it's difficult to trouble
shoot with the usual browser plugins. How about giving the same
example with static code? (i.e. the result of the csshover.htc)

--
Els http://locusmeus.com/

Els [ Mi, 07 November 2007 15:53 ] [ ID #1865215 ]

Re: IE Shows Spaces Between Boxes

VUNETdotUS wrote:
> Hello,
> IE shows spaces between a few boxes made of ul-li elements in CSS
> unlike Firefox. I tried padding/margin in different places but cannot
> fix it. The URL is http://www.vunet.us/wic/test/ztop.asp, see pop-up
> menu over link "My Test"
> Please, recommend a fix for IE. The menu keeps disappearing because of
> the gaps (spaces) when moving mouse up and down.
> Thanks.
>

You're in quirks mode IE will use old non-standard rendering. First
switch to the 4.01 strict doctype. Remove all those z-index properties
they are not needed. Many times to successfully debug you need to
*remove* not *add* things...

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

lws4art [ Mi, 07 November 2007 17:13 ] [ ID #1865223 ]

Re: IE Shows Spaces Between Boxes

Jonathan N. Little wrote:

> VUNETdotUS wrote:
>> Hello,
>> IE shows spaces between a few boxes made of ul-li elements in CSS
>> unlike Firefox. I tried padding/margin in different places but cannot
>> fix it. The URL is http://www.vunet.us/wic/test/ztop.asp, see pop-up
>> menu over link "My Test"
>> Please, recommend a fix for IE. The menu keeps disappearing because of
>> the gaps (spaces) when moving mouse up and down.
>> Thanks.
>>
>
> You're in quirks mode IE will use old non-standard rendering. First
> switch to the 4.01 strict doctype. Remove all those z-index properties
> they are not needed. Many times to successfully debug you need to
> *remove* not *add* things...

As far as I can see, his page is rendered in standards mode; a
transitional doctype doesn't mean quirksmode. Only IE5 does quirksmode
on this page, but it would do that on a Strict page too.

--
Els http://locusmeus.com/

Els [ Mi, 07 November 2007 17:22 ] [ ID #1865226 ]

Re: IE Shows Spaces Between Boxes

On Nov 7, 11:13 am, "Jonathan N. Little" <lws4... [at] centralva.net>
wrote:
> VUNETdotUS wrote:
> > Hello,
> > IE shows spaces between a few boxes made of ul-li elements in CSS
> > unlike Firefox. I tried padding/margin in different places but cannot
> > fix it. The URL ishttp://www.vunet.us/wic/test/ztop.asp, see pop-up
> > menu over link "My Test"
> > Please, recommend a fix for IE. The menu keeps disappearing because of
> > the gaps (spaces) when moving mouse up and down.
> > Thanks.
>
> You're in quirks mode IE will use old non-standard rendering. First
> switch to the 4.01 strict doctype. Remove all those z-index properties
> they are not needed. Many times to successfully debug you need to
> *remove* not *add* things...
>
> --
> Take care,
>
> Jonathan
> -------------------
> LITTLE WORKS STUDIOhttp://www.LittleWorksStudio.com

I removed most z-indexes, removed .htc file, changed doctype to
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
.... same thing. Only when I am over "right div" bar, IE7 does not hide
menu.
Sorry, I did not changed my example online: no access at the time. I
implemented your suggestions locally by copying code.
Isn't it some CSS box properties I need to look at?
Thanks.

vunet.us [ Mi, 07 November 2007 18:10 ] [ ID #1865234 ]

Re: IE Shows Spaces Between Boxes

VUNETdotUS wrote:

> Sorry, I did not changed my example online: no access at the time. I
> implemented your suggestions locally by copying code.
> Isn't it some CSS box properties I need to look at?

Now that I know it's not the htc file, I copied your page locally, and
found what's causing it: white space between the <li> elements. I'm
not sure if there is another way to get rid of it without a lot of
hacking, but if you just put the <li> elements connected, the space is
gone.
Like so:
<ul>
<li><a....>AAAAAA</a></li
><li><a....>BBBBBB</a></li
><li><a....>CCCCCC</a></li
><li><a....>DDDDDD</a></li
><li><a....>EEEEEE</a></li>
</ul>

(or just all on one line, but this way it is easier to read)

--
Els http://locusmeus.com/

Els [ Mi, 07 November 2007 18:29 ] [ ID #1865236 ]

Re: IE Shows Spaces Between Boxes

Els wrote:
> VUNETdotUS wrote:
>
>> Sorry, I did not changed my example online: no access at the time. I
>> implemented your suggestions locally by copying code.
>> Isn't it some CSS box properties I need to look at?
>
> Now that I know it's not the htc file, I copied your page locally, and
> found what's causing it: white space between the <li> elements. I'm
> not sure if there is another way to get rid of it without a lot of
> hacking, but if you just put the <li> elements connected, the space is
> gone.
> Like so:
> <ul>
> <li><a....>AAAAAA</a></li
> ><li><a....>BBBBBB</a></li
> ><li><a....>CCCCCC</a></li
> ><li><a....>DDDDDD</a></li
> ><li><a....>EEEEEE</a></li>
> </ul>
>
> (or just all on one line, but this way it is easier to read)
>

IE whitespace bug.. Worst when in quirks mode.

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

lws4art [ Mi, 07 November 2007 18:32 ] [ ID #1865237 ]

Re: IE Shows Spaces Between Boxes

Jonathan N. Little wrote:

> IE whitespace bug.. Worst when in quirks mode.

But IE wasn't in quirks mode :P

--
Els http://locusmeus.com/

Els [ Mi, 07 November 2007 18:39 ] [ ID #1865239 ]

Re: IE Shows Spaces Between Boxes

On Nov 7, 12:29 pm, Els <els.aNOS... [at] tiscali.nl> wrote:
> VUNETdotUS wrote:
> > Sorry, I did not changed my example online: no access at the time. I
> > implemented your suggestions locally by copying code.
> > Isn't it some CSS box properties I need to look at?
>
> Now that I know it's not the htc file, I copied your page locally, and
> found what's causing it: white space between the <li> elements. I'm
> not sure if there is another way to get rid of it without a lot of
> hacking, but if you just put the <li> elements connected, the space is
> gone.
> Like so:
> <ul>
> <li><a....>AAAAAA</a></li
> ><li><a....>BBBBBB</a></li
> ><li><a....>CCCCCC</a></li
> ><li><a....>DDDDDD</a></li
> ><li><a....>EEEEEE</a></li>
> </ul>
>
> (or just all on one line, but this way it is easier to read)
>
> --
> Els http://locusmeus.com/

WOW! Deepest thanks. IE...

vunet.us [ Mi, 07 November 2007 18:44 ] [ ID #1865240 ]

Miscellaneous » alt.html » IE Shows Spaces Between Boxes

Vorheriges Thema: Disable QuickTime
Nächstes Thema: Legit 3rd-party email services for huge lists?