I have this website, http://www.escuelita.info. Now I tried many times to make it work on IE 7 (possibly IE6 too didn't check) but for some reason the middle frame on the right doesn't show content.
If you compare it to Firefox or Chrome (or even IE8) it works ok.
I need to fix this but I'm not sure what's causing the problem..
Note
I checked with IE7 and the pages don't show content
(the main content DIV content_outer)..
The content shows below the sidebar. Either IE7 enters quirks mode or you trigger some sort of bug that causes IE7 to misbehave.
Double check your doctype, tags and most importantly, get rid of those nested tables. Nested tables are EVIL and I'd bet they're your culprit. Use CSS grids (here's one that's really good: http://www.1kbgrid.com/) instead.
Dunno if this solves your problem, hopefully so.
Related
I am building a photo portfolio website using wordpress and editing an existing theme. I worked on it in firefox and checked a few times throughout at the styling in IE and it was always fine. But having basically finished I looked at it today and it in IE and it is totally messed up. None of the boxes on the main page are lined up right.
I tried using the code in the header to have IE render it as IE7 and that generally worked but it made some other little problems. I am not sure if the problem is my doctype. I don't really know what it should be, or if I changed something along the way that messed it up.
The site works perfectly in all other browsers that I have tried
Here is the site. http://theshalomimaginative.com/blog/
Thanks.
Youre <h3> tags aren't closed. One of the few instances where IE is actually rendering things correctly ;) Other browsers will allow us to make mistakes like this, but IE is more strict.
Never forget the value of validating your code!
In Chrome, my site has a bunch of empty space at the end.
Some pages have lots of empty space, some have none. I'm not sure what the problem is, I've tried lots of different changes in the css (using chrome's inspect element), but nothing fixes the problem.
There is no problem in Firefox, I don't know about IE right now.
Edit: Removed links. None of those pages exist any more.
The problem is the last hr element.
It has display: inline-block.
Remove that property value and it works fine.
It has been listed as a rendering bug: see here
http://41.206.47.2/support/forum/p/Chrome/thread?tid=6d78452432a4c4d7&hl=en
Seems to have been fixed in later dev versions. I get the same issue in 11.0.696.65
can someone look at this site for me I have a serious problem with the sub pages content div going over to the right bar this issue the site renders fine in all other browsers except safari firefox and iphone
www.firstavenuedesign.co.uk/demo
http://www.firstavenuedesign.co.uk/demo/offers.aspx
if u look at the above page in ie it will display fine and chrome any ideas anyone
It looks as though the problem you are having relates to your parent DIV 'collapsing' on your floated child elements.
The following article explains how to resolve this issue (in the Collapsing section) a long with other approaches for laying out floating elements:
http://www.alistapart.com/articles/css-floats-101/
Validate your html and css for those lists of significant errors. Then get this working in a modern browser before seeing how IE screws things up. The other browsers are showing what you wrote. IE makes things up as it goes along. Never, ever trust IE to do anything right.
Also, you have space before the doctype. Some versions of IE go into quirks mode in that situation.
i have this page.
login: miguel#mail.com
pass: m
As you can see in FF the filter is on the right of the list, but in IE6 not..
How do I fix this problem?
Your HTML code does not validate. This would be my first step in getting it to work in Internet Explorer 6. http://validator.w3.org/.
If this does not fix it, I would check up on IE6's layout bugs. See http://www.positioniseverything.net/explorer.html.
If you still haven't found a solution then try with the simplest page, and make that one work in IE6. Then slowly add all the elements on your page, so that you can identify what is causing the problem.
IMHO getting it to look right in IE6 isn't worth the trouble, as you can see (http://www.w3schools.com/browsers/browsers_stats.asp) only 7.1% percent of people are using IE6 now. Was there any specific reason that you have to get it right in IE6? (ie the company you are with has 600 PCs with IE6 on)
I am pulling my hair trying to find a fix for this problem. If you go to this site you will see that (under IE) the slider and the menu on the top is broken. Works fine under all modern browsers.
Any idea how to fix this? Thanks.
Edit: Want to add that the original site design works fine under IE. I did a massive amount of editing under the hood and somewhere along the line this one was broken that I can't seem to find a fix for. Since I did a lot of customization, I think it seems unfair to ask the original author for a fix (and he is not very responsive either).
The document invalid. In particular, there is a <style> element before the Doctype. This triggers Quirks mode and causes browsers to become very inconsistent (e.g. IE emulates a log of bugs from IE 5.5).
Always work in standards mode and perform basic automated QA.
I can't check it for you, since I've not got access to IE right now, but I've often found that adding position:relative to misbehaving elements is something of an IE magic bullet.
No fix but a lead: the issue with the menu bar is one of IE's mysterious float positioning bugs, as can be demonstrated by putting <div style="clear: both">xxx</div> after the navbar ul. (Note that it won't work if the div has no content!)
stuff about box model deleted: as David Dorward mentions this is caused by quirks mode, and moving the style down past the doctype causes the slider to behave sensibly.