Working on a new site. I'm deciding whether or not to use tables or div's in the middle. Each is giving me it's share of problems. In Firefox it displays everything right, but in IE it displays it wrong. The site is www (dot) bookbandit (dot) ca This is what it looks like in firefox: http://media504.com/b/firefox.gif This is what it looks like in IE: http://media504.com/b/ie.gif Anyone have any idea of how to make them both look right?
The 2 example images are the same. the link with ie.gif actually opens firefox.gif. I looked at it in IE& and the center content is shifted down. In the testie div you might want to try this code: <div id="testie" style="vertical-align: top;"> In new sites you should always use the Strict version of either HTML or XHTML. In your case you should be using XHTML 1.0 Strict instead of Transitional. This will result in a more consistent rendering across browsers. See this article: http://www.robertnyman.com/2005/11/02/html-or-xhtml/ Hope it helps...
IE screws everything up so it's nothing surprising. In this case, it will be something with setting widths somewhere. But you removed the images and the html for them so I can't help.
Not true at all. XHTML doesn't even work in IE. If not served as XHTML, it's treated as broken HTML anyway, and no one here knows how to serve it properly. Also, whether you use strict or transitional is for the benefit of the validator, not the browser. But, yes, no one has any need for transitional and all new pages should always use the strict doctype.
No, the extra bull from 1.1 and that whole XML application nonsense that doesn't do anything you can't do simpler by other means doesn't work in IE. There is little if anything in XHTML 1.0 that does not work in IE - the reason to use XHTML 1.0 is for the structure and the possiblity of easier data scraping, in which case there's nothing wrong with using it. As to the page in question, there are problems galore - loading the CSS using the legacy Non-netscape method, **** that since it means no media types... to hell with people still using NS4. You have javascript trying to do CSS's job in the form of that slow buggy menu (that behaves really badly in Opera and Webkit), you seem to have a number of DIV that aren't even neccessary, are abusing a definition list for the menu, (DL with nothing but DT - whiskey tango foxtrot?), DIV's that should be HEADING tags. (seriously, div class="heading" is serious tarfu) and that's before we even talk about the CSS. The short reset * {margin:0; padding:0;} makes styling your form elements almost impossible cross browser (IE really flakes out on that), you appear to be floating elements that don't need to be floating, your width is about 8px too wide to actually be 1024 friendly, Not that there is any reason to be fixing the width, etc, etc, etc... Gimme, 20 minutes to get some coffee in my system and I'll take a stab at a quick drop-in rewrite. (Aka I'll drop it into one of my standard baselines).
For reference, we're talking via IM - here's how I rewrote it http://www.cutcodedown.com/for_others/redstar504/
Nice work DeathShadow. It renders fine now in IE7 and FF3. Crossroad, here are the browser usage numbers: http://www.w3schools.com/browsers/browsers_stats.asp. IE )3 versions) is still in the game, but Firefox passed it this year.
What I'm referring to is serving XHTML as XHTML. Most of the people here think that just because they use the XHTML doctype, that the browser treats it as XHTML, which, as you know, is not true at all and all browsers treat it as HTML, and broken HTML at that. XHTML served as application/xml+xhtml has never worked in IE and Microsoft has no plans to support it ever.
Skewed values since that's for W3Schools, whose visitor base tends to be a bit more 'tech saavy. To quote their own website: You are, and the specification SAYS you are. What you are referring to is serving it as XML - which is NOT the be all end all of X 1.0. If you were talking 1.1 I'd agree wholeheartedly... but hell, I still don't know why 1.0 isn't just done as text/XML, excepting that then IE may actually treat it as XML I keep hearing that, and have YET to see a single case in which that would be true. It works just FINE. If anything it tends to be perfectly fine processing HTML that builds a completely working DOM, even in IE. If it fails anywhere it's in terms of XML since few pages are 'well formed'. (especially the people working in tranny) ... and I have yet to see ANYTHING app/XML brings to the table that couldn't be done faster/better/in less code without it, so who gives a ****? Unless you are dealing with in-house crapplets, in which case you'd probably just be vomiting up code in VB
Good points deathshadow. I did another browser usage statistics search and wikipedia seems to be comprehensive and forthcoming with the accuracy of their numbers.
Hi there, I think you should make separate css file for ie or trying used div rather than table Regards, WS
/FAIL/, there's nothing on the page that warrants it... but then I say that about most every layout! I generally consider telling people to use separate stylesheets via IE conditionals to be bad advice as it is rarely if ever actually neccessary, and it's just harder to maintain two files targeting the same elements instead of one. Haslayout here, few simple rules there, never trust default line-height, maybe an expression to replicate missing functionality in 6/earlier... Nothing that can't be sent safely to all browsers - even the ones that don't validate... But I have the viewpoint that there is NO reason not to have valid markup, but very good reasons to ignore CSS errors if you know WHY it's an error. (zoom:1 for example, or -moz-inline-box) Which is what I talked him into via IM. He's digging the fact that when floated they can go fluid and/or mcSwitchy on it.
First of all i would suggest you to work a bit more on its design because to be honest its not looking like a perfect professional website. Change the position of the navigations.