bigsilk Posted September 3, 2009 Share Posted September 3, 2009 This site looks different in different browsers. In Chrome and Safari it looks correct, but in IE8, FF and Opera it doesn't. Of course, I can make it look right in one or two browsers at a time by changing the CSS. But for the sake of not knowing what browser you kind viewers are using, I'll leave it as is until I hear from one/some of you. The reason it looks correct in Chrome is because that's what I use by default.Now, I've seen !important; used in pages. What's that for? Is it relevant to this problem?Thanks,A Link to comment Share on other sites More sharing options...
chibineku Posted September 3, 2009 Share Posted September 3, 2009 !important tells the browser to use this value for this property even if it would be overridden later in the cascade (it still doesn't always win, as user set preferences marked !important are at the top of the food chain). Are you using a STRICT doctype? It will get you the greatest compliance from all browsers (except IE6 and earlier). If you are still having problems even with a STRICT doctype, there are ways to hide code from newer browsers, such as commenting bits of code:<!--[if IE 6]>Special instructions for IE 6 here<![endif]-->If that fails, you can use PHP to detect browser versions and echo the relevant code to fix the problem, just make sure you echo any changes lower down in the page, so they have precedence. Link to comment Share on other sites More sharing options...
bigsilk Posted September 3, 2009 Author Share Posted September 3, 2009 Great, that did it for the most part. The only one that it didn't work for (oddly) is FF. Here I thought FF was the gold standard for designers and developers alike...So, is this an instance where I might use:<!--[if browser]>Special instructions for browser here<![endif]-->and, if so, what would I use to call out FF for special instructions?Thank you.A Link to comment Share on other sites More sharing options...
chibineku Posted September 3, 2009 Share Posted September 3, 2009 Unfortunately that won't work for FF. FF usually doesn't display stuff erroneously. What is it that FF isn't displaying right? Link to comment Share on other sites More sharing options...
bigsilk Posted September 3, 2009 Author Share Posted September 3, 2009 It's just the part that says 'welcome to this website'. It needs to drop maybe twenty or so px. The menu bar goes over the header img and the 'welcome...' covers the space between the bg img (the lt colored hearts) and the header img.A Link to comment Share on other sites More sharing options...
dsonesuk Posted September 3, 2009 Share Posted September 3, 2009 if you validate this page in opera (right-click page->validate) it will point out where you going wrong, multiple id ref with same name (should be unique), div block elements within an inline element <span>.!important can be used to assign a different value say a margin width for IE6 browser, as IE6 does not recognise the !important part, if you use#thisid {margin-left: 10px !important;margin-left: 5px;}IE6 will ignore the first line, and carry out the second line, whereas all other browsers will carry out the first line. Link to comment Share on other sites More sharing options...
dsonesuk Posted September 3, 2009 Share Posted September 3, 2009 you also need to set the character encoding. Add below just below the <head> tag:<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.