Hi all, I have a website http://www.eldancall.com/team. It works perfectly in Mozilla. But in everything else its look wack. I need some form of html that will allow me to have a bar of color at the top of the page, and a bar of color at the top of the page, with the login box centered. Aparentently, IE does not recognise the table width="100%" attribute, now does it recognize some CSS classes that I am using. If anyone could help me with this, I'll be so grateful Thanks
I would recommend putting this into CSS. I could help you create something really quick that would look good in IE7, IE6 and FireFox.
If you wish to have any reasonable chance of achieving x-browser compatibility, you must use a complete and proper DTD to trigger standards mode. See http://www.communitymx.com/content/article.cfm?cid=85fee cheers, gary
LeetPCUser and Gary are both right. The easiest way to achieve maximum cross-browser compatibility is to utilize CSS properly and make sure you are compliant with markup standards. I would recommend converting your tabled setup into a setup using <div>s with ids and classes. You don't have any DTD, and you need a proper DTD to invoke standards mode, and your code needs to validate to whatever standard you choose (I like XHTML Strict). Instead of declaring size attributes in the tags on the page, assign them ids or classes and declare those as styles in CSS. This makes it easier to find and edit these attributes, and ensures that any modern browser will be able to render your intended look. If you learn better use of CSS it will make your web development experience so much easier.
Yup, no doctype == fail. To that we can add invalid markup (you misspelled head, you don't close body or html), dated presentational markup, wrapping stuff that aren't paragraphs in paragraph tags, wasting a table on the footer for no fathomable reason, position absolute on what appears to be a flow element, etc, etc. I'd also take you to task for using a table for layout - except assuming those boxes are dynamic height getting them to center top to bottom without hacks or tons of code the table is the only real solution. Part of what is likely biting you is the inconsistant fieldset and legend behavior - which is why I null the behavior of both in my forms and then wrap fieldsets in a DIV and the content of a legend in a span. It's a hair more markup, but at least gives you tags you can apply style to predictably while keeping the form tags "needed" for accessability.
Here, I had a spare moment, so I did a quick rewrite. This is how I'd write that page (I'm assuming you also wanted those centered horizontally) http://battletech.hopto.org/for_others/praisehim/template.html That's how I'd have gone about that. the directory: http://battletech.hopto.org/for_others/praisehim is unlocked so you can grab the bits and pieces. Valid XHTML 1.0 Strict, works in IE 5.5, 6 & 7, FF 2 & 3, Opera 9.27 and 9.51, and Safari 3.