Hey guys I am working on the header to my website and I am really hurting here. The code to my header can be found at: http://www.geocities.com/smm18951/header.txt It doesn't matter what I do, this damn thing just wont shape up for me in firefox. It looks great in IE 6 and IE 7, but more than half the web is using Firefox now(I swear by it). Can anyone help me out of offer suggestion as to how to fix it. In case you can't tell from looking at the code, I am still very new to css. Thank you
Ok, first off you should ease up on the inlined CSS and dump that in a stylesheet - second you should probably NOT be browser-sniffing server-side... third you should probably be using CSS for the button states via a class and image recombining... You REALLY should not be sending that echo up top before you even send a DOCTYPE as that throws IE into quirks mode... and is REALLY invalid HTML... and I'd axe that stupid image precache script as the image recombining I mentioned would make that obsolete. You've got about four times the php logic that should be needed there. If I have some time later I'll see if I can clean it up.
Oh man if you could help me out there, that would be so stinkin awesome. I am really struggling with it.
Gah, even bigger problems: <a href="http://www.woocha.com/" title="Click here to return to Woocha.com">'; <div id="tabs" align="center"></a> <img src="http://www.woocha.com/images/spacer5.gif"><img src="http://www.woocha.com/images/spacer2.gif"><img src="http://www.woocha.com/images/spacer2.gif"><img src="http://www.woocha.com/images/spacer10.gif" as if spacer.gif's weren't bad enough, you are opening the anchor, opening the div then closing the anchor - you can't do that, that's invalid HTML. DL that only has terms... (at which point that should be a UL) DIV around the form instead of inside... there's a laundry list of bad code here.
If you are able, some sites use PHP to show a stylesheet for IE, and a style sheet for FireFox, it's simple code, but can be effectively. Not that it's any excuse not to have tidy code though
All round BAD idea - but again if you are using a valid doctype with nothing before it, there is little if any reason to be feeding separate stylesheets to each. Waste of code, waste of php parsing time - it's just bad... and more than likely to break when the next flavor of the month comes along - and in this case almost guaranteed to not work for Opera or Safari.
deathshadow, I altered what you to do so far, can you make any other suggestions for my....Thank you for the help so far!
OK....I got the header to look great in both IE6 and firefox, but if you make the font size (senior citizen) large the header goes all screwy. Here are link to the header and to the style sheet. http://www.geocities.com/smm18951/header.txt http://www.geocities.com/smm18951/style.txt Can anyone offer up some good suggestions? Thank you ALSP: I can't seem to get this darn thing centered with out using the <center> tag, which I am told you are not supposed to use.
Well, axe the XML prolog as that's throwing IE into quirks mode. You are only using span once inside each anchor in the menu so ditch the class on it (I'd probably use a bold tag there), titles are pretty much ignored by search engines and users alike so I'd axe those too (if your text inside the anchor isn't enough to describe it, you probably need better text!) Is that list of inputs a paragraph of text? No it is NOT. So why are you marking it up as a paragraph? The text next to each input - those kind of look like labels, maybe they should be marked up as such? <br/><br/><br/><br/><br/> /FAIL//FAIL//FAIL//FAIL//FAIL/ That's what bottom-margin or top-margin on those elements with the nice little ID's on them is for. http://www.woocha.com/images/spacer5wide.gif Spacer .Gif? See above. Margins and padding not waste a bunch of bandwidth on some stupid little image. ... and you might want to consider designing with RELATIONAL links instead of hardcoding links to everywhere. Would make local testing a lot easier on you nd a lot less of a headache. If I have time later, I'll toss together a code example of how I'd handle that page's headers/footers/layout.