Hey all i have done a website design for a friend and i am having problems with how the website is showing up in different browsers, it is fine in the latest version of google chrome however on the latest internet explorer the layout is not right as everything moves to the left. Does anyone know how to sort this out and how the get the site to show up the same on all browsers? Thanks Kieran
There are differences in how each browser displays each site, the easiest way to fix it is figure out what code IE is not reading correctly and attempt to correct that. If that breaks the other versions then there are ways to create alternate stylesheets for each browser. There is not going to be any magical easy fix though.
Absolutely the worst way to handle this. You test in a modern browser first, anything but IE. Once it works there, and validates, you look at the other modern browsers (not IE). Everything should be fine. THEN look at IE to see how it screws everything up, but the bugs and quirks of IE are well known, as are the hacks to fix it. Do NOT make "alternate stylesheets for each browser". This is never needed and only IE needs fixing with conditional comments, as CSM points out.
Include a DOCTYPE declaration. Which one to use will depend on whether you are coding for HTML or XHTML. You can't mix them up, pick one. Validate your HTML coding. Validate your CSS coding That will eliminate your coding as what is causing the problem. It doesn't solve cross browser issues but it does narrow down the problem. Each browser interprets the HTML elements differently (whether they are a "modern" browser or not). IE is getting better with each version released to become a standards compliant browser. They have a bunch of people on the HTML Working Group Membership, so they should. I would however stay away from any and all hacks to get your problems solved. Why? Because you are creating work for yourself later when IE changes versions and that version becomes main stream. e.g. IE6 to IE7 saw major sites broken because the designers used hacks. IE7 to IE8 also had this problem but quite as bad. From your opening post it sounds like you are a novice web site builder (not meant to insult, an experienced designer would have been a bit more specific as to the issues they were having is all) so I'm guessing your issues are coding ones. Start with code valiation and see if that solves your issues.
Each browser has his own "CSS styles" included and each browser renders HTML/CSS properties differently. Some browsers do the W3C specifications (modern browsers), some not (crap IE). Thanks, Doc
Nowadays, all browsers interpet HTML just fine and the same, except for the new HTML5 elements but, then, it's more a matter of whether implementation exists or not. When you're the worst on the planet, the only way to go is up, but they are still 12 years behind all the others.
Use conditional comments to add IE specific CSS styles. http://www.techtricky.com/add-css-styles-for-ie-only/
if you're problem is in Internet Explorer, you must do something on your CSS file. you can use IE hack or add some codes on the CSS, most of the time on my experience these things will help: float <-- helps a lot on IE problems display-inline add line-height