IE Shows Spaces Between Boxes

11-07-2007

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.

11-07-2007

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/

11-07-2007

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

11-07-2007

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/

11-07-2007

On Nov 7, 11:13 am, "Jonathan N. Little" <lws4...@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.

11-07-2007

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/

11-07-2007

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

11-07-2007

Jonathan N. Little wrote:

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

But IE wasn't in quirks mode

--
Els http://locusmeus.com/

11-07-2007

On Nov 7, 12:29 pm, Els <els.aNOS...@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...

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Frame shows spaces between the table cells.	Cal Who	ASP .Net	4	05-17-2010 11:28 AM
[CSS] how can I show spaces as spaces?	Tomasz Chmielewski	HTML	21	09-10-2009 06:43 PM
Space between input boxes and selection boxes is not the same in Internet Explorer	Stefan Mueller	HTML	5	06-16-2009 02:06 PM
Re: How to trim a String trailing spaces, but not leading spaces?	Roedy Green	Java	3	09-14-2008 02:10 AM
Re: How to trim a String trailing spaces, but not leading spaces?	John B. Matthews	Java	4	09-12-2008 05:28 AM