Internet Explorer 6/7 Ignoring Left Padding on One Element?

I have links on the top of my home page. Each link has a background
image (a bullet) and the text of the link. The div for the text has a
left padding of 30px to keep it from landing on top of the bullet in the
background image. This is working perfectly on Mac Firefox and Safari,
but is not yet working on IE 6/7. Oddly, the padding is ignored on the
first link, but works properly on the other links.

Here's a link to a .gif showing what it looks like:

http://www.market-research-services.com/For_Distribution/ie_ padding_anoma
ly.gif

Here's the HTML:

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

Well bust mah britches and call me cheeky, on Thu, 17 Jan 2008 17:44:07
GMT Vik Rubenfeld scribed:

> I have links on the top of my home page. Each link has a background
> image (a bullet) and the text of the link. The div for the text has a
> left padding of 30px to keep it from landing on top of the bullet in
the
> background image. This is working perfectly on Mac Firefox and Safari,
> but is not yet working on IE 6/7. Oddly, the padding is ignored on the
> first link, but works properly on the other links.
>
> Here's a link to a .gif showing what it looks like:
>
> http://www.market-research-
services.com/For_Distribution/ie_padding_anoma
> ly.gif
>
> Here's the HTML:
>
>

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

Neredbojias wrote:

> "Home" isn't a link.

True, but, on pages of the site where it is a link, the same thing
happens.

What could be causing this?

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

Well bust mah britches and call me cheeky, on Thu, 17 Jan 2008 22:52:45 GMT
Vik scribed:

> Neredbojias wrote:
>
>> "Home" isn't a link.
>
> True, but, on pages of the site where it is a link, the same thing
> happens.
>
> What could be causing this?

Have you an example?

--
Neredbojias
Riches are their own reward.

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

Neredbojias wrote:

> Have you an example?

Surely. You can see it at flavorzoom.com. Thanks very much in advance
for any thoughts!

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

On 17 jan, 12:44, Vik Rubenfeld wrote:

> I have links on the top of my home page. Each link has a background


> How can I fix this?
>
> Thanks very much in advance to all for any info!

Vik,

Would it be possible for you to
- fix the validation markup errors in your webpage, all of them
- then fix the CSS errors in your CSS code, all of them, in particular
the ones targeting IE as CSS hacks
- then provide the URL of (temporary or current) webpage where the
problem may still be occuring

It is useless to post code if we do not have access to the whole code
loaded on a web-accessible webpage. Sometimes, it could even be
necessary to check the HTTP headers of the server...

Regards, G=E9ard

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

GTalbot wrote:

> Vik,
>
> Would it be possible for you to
> - fix the validation markup errors in your webpage, all of them
> - then fix the CSS errors in your CSS code, all of them, in particular
> the ones targeting IE as CSS hacks
> - then provide the URL of (temporary or current) webpage where the
> problem may still be occuring
>
> It is useless to post code if we do not have access to the whole code
> loaded on a web-accessible webpage. Sometimes, it could even be
> necessary to check the HTTP headers of the server...
>
> Regards, Géard

You are quite right. I have put up a small test file at:

http://flavorzoom.com/anomaly.html

This has just the CSS and the HTML needed to demonstrate the anomaly. I
validated it at http://validator.w3.org/.

As before, the page looks as it is expected to in Mac Firefox and
Safari, but not in IE 6/7.

Thank you very much in advance for any thoughts on what could be causing
this!

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

"Vik Rubenfeld" wrote in message
news:vikr-2E0DF3.22591517012008@earthlink.vsrv-sjc.supernews .net...
> GTalbot wrote:

> http://flavorzoom.com/anomaly.html

Resize the window, at around 1000 pixels wide and larger the problem
disappears. Now, resize the window very slowly around the width where the
problem appears/disappears. At one particular width the entire menu
disappears.

This could be a manifestation of the peek-a-boo bug. Google for it, it's
quite well known.

--
Richard.

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

Well bust mah britches and call me cheeky, on Fri, 18 Jan 2008 00:25:40 GMT
Vik Rubenfeld scribed:

> Neredbojias wrote:
>
>> Have you an example?
>
> Surely. You can see it at flavorzoom.com. Thanks very much in advance
> for any thoughts!

Hmm, works fine for me in SeaMonkey. Oh, right, the prob is in IE. Hmm
again, works in IE 7. (Don't have ie6.) Did you fix it?

--
Neredbojias
Riches are their own reward.

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

On 18/01/08 06:59, Vik Rubenfeld wrote:
> GTalbot wrote:
>=20
>> Vik,
>>
>> Would it be possible for you to
>> - fix the validation markup errors in your webpage, all of them
>> - then fix the CSS errors in your CSS code, all of them, in particular=

>> the ones targeting IE as CSS hacks
>> - then provide the URL of (temporary or current) webpage where the
>> problem may still be occuring
>>
>> It is useless to post code if we do not have access to the whole code
>> loaded on a web-accessible webpage. Sometimes, it could even be
>> necessary to check the HTTP headers of the server...
>>
>> Regards, G=E9ard
>=20
> You are quite right. I have put up a small test file at:
>=20
> http://flavorzoom.com/anomaly.html
>=20
> This has just the CSS and the HTML needed to demonstrate the anomaly. I=
=20
> validated it at http://validator.w3.org/.
>=20
> As before, the page looks as it is expected to in Mac Firefox and=20
> Safari, but not in IE 6/7.
>=20
> Thank you very much in advance for any thoughts on what could be causin=
g=20
> this!

OK, you validated the HTML. But did you validate the CSS? Some errors =

show up at:

http://jigsaw.w3.org/css-validator/


Ed

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

In article <13p0tbh2gr1t77b@corp.supernews.com>, Ed
wrote:

> OK, you validated the HTML. But did you validate the CSS? Some errors
> show up at:
>
> http://jigsaw.w3.org/css-validator/

I have now revised and validated the CS using
http://jigsaw.w3.org/css-validator/. The same error is still being seen.

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

In article ,
"rf" wrote:

> > http://flavorzoom.com/anomaly.html
>
> Resize the window, at around 1000 pixels wide and larger the problem
> disappears. Now, resize the window very slowly around the width where the
> problem appears/disappears. At one particular width the entire menu
> disappears.
>
> This could be a manifestation of the peek-a-boo bug. Google for it, it's
> quite well known.

Researching the peek-a-boo bug led me to this page -
http://www.thescripts.com/forum/thread468484.html. Based on the
experience of the poster there, I added:

html {
margin: 0px;
padding: 0px;
}

body {
margin: 0px;
padding: 0px;
background: #FFFFFF ;
}

....and it fixed it!

Adding that code to my main CSS file hasn't yet fixed my production
page, so I need to validate all the CSS and html there now - I may have
some more questions when doing that. But this appears to be the fix.

Thanks very much to all here for your help!

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

Okay, this seems very odd.

I've been working on tracking down what was still wrong with the CSS on
my production page, and what I've found seems unusual. I've replicated
it on two small test pages.

http://www.flavorzoom.com/anomaly.html is fine and looks as expected.

http://www.flavorzoom.com/anomaly_b.html has the image for the left-most
link ("Home") missing (in IE6).

The only difference between the two files, is a font-family
specification for the html:

font-family: Arial, Helvetica, sans-serif;

What could explain this?

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

Well bust mah britches and call me cheeky, on Fri, 18 Jan 2008 17:48:53 GMT
Vik Rubenfeld scribed:

> Okay, this seems very odd.
>
> I've been working on tracking down what was still wrong with the CSS on
> my production page, and what I've found seems unusual. I've replicated
> it on two small test pages.
>
> http://www.flavorzoom.com/anomaly.html is fine and looks as expected.
>
> http://www.flavorzoom.com/anomaly_b.html has the image for the left-most
> link ("Home") missing (in IE6).
>
> The only difference between the two files, is a font-family
> specification for the html:
>
> font-family: Arial, Helvetica, sans-serif;
>
> What could explain this?

Try moving that to body: (only). Maybe IE balks at html: styles.

--
Neredbojias
Riches are their own reward.

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

Neredbojias wrote:

> Try moving that to body: (only). Maybe IE balks at html: styles.

I moved it to body, but the result is the same. (????)

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

Solved! It was a hasLayout issue. I added:

display:inline-block;

....in .selected and in #fz_menuin a, and it fixed it.

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

Update: it fixed it in IE6 and Mac FireFox, but broke it in Safari 3, as
can be seen in the demo link I posted (which I have now updated) -

http://www.flavorzoom.com/anomaly_b.html

Is there a way to address the hasLayout issue that will also work in
Safari?

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

On 2008-01-18, Vik Rubenfeld wrote:
> Update: it fixed it in IE6 and Mac FireFox, but broke it in Safari 3, as
> can be seen in the demo link I posted (which I have now updated) -
>
> http://www.flavorzoom.com/anomaly_b.html
>
> Is there a way to address the hasLayout issue that will also work in
> Safari?

Why all those inline-blocks set to width: 1em? That makes them all
scrunched-up in browsers that support inline-block.

I don't know if this is the anomaly you're referring to.

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

Ben C wrote:

> Why all those inline-blocks set to width: 1em? That makes them all
> scrunched-up in browsers that support inline-block.
>
> I don't know if this is the anomaly you're referring to.

That fixed it. Thanks very much!

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

Well bust mah britches and call me cheeky, on Fri, 18 Jan 2008 19:58:25 GMT
Vik Rubenfeld scribed:

> Neredbojias wrote:
>
>> Try moving that to body: (only). Maybe IE balks at html: styles.
>
> I moved it to body, but the result is the same. (????)

Well, I'm nonplussed. The only thing I can think of to do is to capture
your source and test it on my box, which I shall do a bit later if rf or
somebody intelligent doesn't solve it first. Benvenuto.

--
Neredbojias
Riches are their own reward.

Re: Internet Explorer 6/7 Ignoring Left Padding on One Element?

Well bust mah britches and call me cheeky, on Fri, 18 Jan 2008 22:27:09 GMT
Vik Rubenfeld scribed:

> Ben C wrote:
>
>> Why all those inline-blocks set to width: 1em? That makes them all
>> scrunched-up in browsers that support inline-block.
>>
>> I don't know if this is the anomaly you're referring to.
>
> That fixed it. Thanks very much!

Aha, great, now I don't have to think! (Thinking is lots of work, you
know.) Sayonara.

--
Neredbojias
Riches are their own reward.