Problem with Internet Explorer 6

Hi,

My website, www.aardvarkbiz.com/e_lindy.php , is not showing well on IE6. No problem on Firefox nor IE7. Here is what's going wrong:

1- The different background images of #content are not showing on all pages, only home is displaying a bg image.

While checking the code on Firefox's firebug, I have noticed the following code that does not exists in my CSS:

-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-originadding;
outline-color:-moz-use-text-color;

I have no idea where it comes from nor how to deactivate it. Is this code responsible for the disappearance of the bg images? How can I get around this problem?

2- #menufoto is showing a border between the buttons, again on IE6, How can I get around it in order to have a complete on image.

3-The e-mail adresse at the bottom on the page is not in it's place, on all browsers.

Appreciate your thoughts on this.

Best regards,

Aardvarkje

 

IE6, 7 and 8 all render differently. This is the joy Microsoft brings to web developers. However, I have seen a big decline in IE6 traffic and many sites have stopped supporting it. I have stopped supporting it on every site I do.

 

BP,

Thanks for your message. I expect that visitors of this site, considering location and age, are the ones still using IE6. So better not to neglect it.

I am puzzeled about the code in the Firebug of Firefox, latest version. How come that it appears there although that it does not exist in the css. Where is it coming from? and how can I deactivate it?

-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin: padding;
outline-color:-moz-use-text-color;

 

#1:
Don't worry. Firebug adds this when you're looking at content:

-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-originadding;
outline-color:-moz-use-text-color;

HTML:

But after looking through your sourcecode, you have a lot of commented out CSS that is mozilla-only source (in style.css).

#2:

img{border:none !important;}

HTML:

#3:

#adreswrapper a, #adreswrapper a:link, #adreswrapper a:visited, #adreswrapper a:active{
	color:#abc6d9;
	background:none;
float:none;
	/*display:inline;
	margin-right:20px;
	padding-right:30px;*/
	}

HTML:

I added a float:none; to that source. (near the bottom of style.css) The reason why it was on the left like that is because ALL the <a> tags are set to float to the left, so naturally the <a> floated on the very left. By removing this floating for the #adreswrapper, it puts the <a> tag (email) back to where it should be.

 

The solution to "a" works, thanks.

Still having problem with items 1 and 2:

1- #content is showing only the background image of the home page but not those of other pages on IE6.

2- #menufoto is still showing a border around the images of the ul.

ps: It is about xhtml 1.0 Transitional not html4.strict

 

Doesn't matter. You aren't serving xhtml so all browsers will treat your markup as html.

 

Problem is solved, thanks.

 

Nice.

Question, less than %5 of users on all my sites use IE 6 so why is it so important to make sure your coding your css correct for an outdated browser. Just wondering.

 

My client is one of those still using IE6! so it is better to get the site IE6 compatible before presenting it to him.

 

You are looking in firebug at the PROPERTIES of the item, which has nothing to do with the CSS declared on it. Scroll down to see the properties declared on it. Those are default values that have NOTHING to do with your problem.

For things that could cause problems in IE, you've got plenty. First off is your comment placement. Yes, you heard me right, COMMENTS can trip rendering bugs in IE - specifically 'disappearing content' and 'double render'.

Where you have this:
</div><!-- einde eersterij -->

change it to this:
<!-- #eersterij --></div>

Putting it before the element close prevents the comment from ending up between two sibling tags, which is where the rendering errors can be tripped. Also, don't waste time saying "end" - Really? </div> might be the END of something? Who knew?

I'm unable to recreate any issues here in IE6 apart from excess padding bleeding through on the page with the google map, but really any sort of issues I would likely try to fix by throwing haslayout triggers at the various elements, or if it's a margin issue make sure the offending floats have display:inline on them - pretty much the standard IE fixes. There's nothing on any of those pages complex enough to need much more than that for fixes...

Though you might want to do something about the accessibility /FAIL/ of fixed metric fonts or worse, the use of images for text- but being that you are working inside a fixed height background image your choices might be limited (just part of why I say the ****tards who draw a pretty picture in photoshop have no **** business 'designing' websites)

 

The Netherlands is not quite hip with modern browsers. Even regular people at home are still using IE6 unless they get an OS upgrade. I'm not really sure why. Younger people are using Firefox and Chrome more though. Guess we'll have to wait for all the oude boeren to die before Ie6 dies : )

 

Your numbers are lower than my numbers - WAY lower. I'm still seeing 20% traffic at most of my sites from IE6, which means I'm still seeing more 6 users than I am 7 or 8.

Really supporting 6 isn't as hard as most people make it out to be - USUALLY the problems stem from design elements or layout choices that shouldn't have been made in the first place, reliance on rendering techniques (like most of CSS3) that aren't ready for primetime and have no business on a deployment website, or just plain outdated markup methodologies.

It's actually amazing how many CSS 'problems' stem not from CSS, but from half-assed use of bloated outdated markup.

 

haha, de oude boeren gaan niet zo gauw dood ben ik bang. I guess that most people in the Netherlands are using updated browsers. The website I am working on is for a company in Portugal.

 

Gelukkig, want de mensen daar zien er meer moderne uit qua browsers dan in nederland : )

I heard once FF was over 40% in Portugal. Hopefully it's even higher now.

Here, we have sites still pulling numbers like DS mentioned: 16-20% IE6, and IE in total is almost 90%. When every possibly customer counts, we still code for IE6. As DS said, it's not really difficult or even much code to do so...

Heck, IE5.5 is pretty usable with most of our sites, as the two or three IE6 statements help IE5 good-enough.

 

Heck, the only real difference between supporting the two of them (between 5.5 and 6) is remembering not to declare a fixed width the same time as padding or borders on an element because of the "broken" box model.

 

Pretty much just that and centering of inner containers, yeah. Which I don't even bother to do.