I've spent a few weeks converting our entire site away from hundreds of table elements to as pure a CSS site I could get away with. There are some compiled modules that I haven't gotten around to converting to CSS versus table tags so I've used CSS to try to enhance the tables where possible. I went from quasi-familiar with CSS to hating it, back to being happy with it over the past two week period.
So far, without using hacks, the site has the same look and feel in Firefox 1.0.5, IE 6 and even under IE 7 beta 1 (haven't loaded beta 2 yet).
What I'm looking for is tips on where I can get better utilization of CSS. I may have made 2 or even 3 CSS elements where I may not need and want to learn better combination techniques to lower the number of CSS elements.
CSS validation complains about the lack of background colors when using a color element which I believe while "proper" can safely be ignored(?). Markup validation complains about my use of the "language" tag and "target" tags but otherwise I'm ok.
Thanks for any help/suggestions.
It seems every validator complains about the -moz opacity and alpha:filter for the quick link section but it works so /shurg.
Your site is coming along nicely. However; your html does not validate.
I would also take notice of the doc type you have chosen. More info about DocTypes is here: http://www.alistapart.com/articles/doctype/
You should also do some reading on Standard Compliance mode vs Quirks Mode as well.
I'm a newbie myself and didn't like having to learn all this stuff, but I can tell you it helps after you understand the basics.
Keep doing it and you will lean all the CSS Shorthand over time. It doesn't take long but it does take effort.
Keep up the good work.
your html does not validate.
I've read a number of articles from this site on doctypes and while dropping to quirks mode doesn't affect the site's structure I wanted to follow some type of strict pattern in the new site design.
I can change those two warnings and get a clean validation run through.
Yes target="whatever" is not suppose to valid in strict.
However you should ckeck into to using XHTML either strict or transitional. Going foreword a good understanding of those will help you tremendously.
I know it did for me.
Using XHTML I was able to refine the elements and get a "This Page Is Valid XHTML 1.0 Transitional!". Now to start cleaning up the CSS. Thanks for the input.
You are best sticking with either:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
Unfortunatley if you want to use the target="whatever" you must downgrade to the Transistional. There are other things as well such as ordered lists with the Start attribute.
However, now that you know that your HTML validates and is well formed you can concentrate on maiking it look nice with the css.
Hi! I think you have a good thing going with your index page, very colourful but not an over-kill. The layout seems user-friendly enough but only until you resize the font/text. Maybe, if you're using height definitions on some of your elements, removing those height definitions will help not break the layout apart on resizing. The internal pages look fine but again, having the same problems on text resize. Cheers!
Hi! I think you have a good thing going with your index page, very colourful but not an over-kill. The layout seems user-friendly enough but only until you resize the font/text.
Hmm..resizing of the font's I never even thought about. I am using a number of height elements to get things to line up correclty so I'll create a staging site, hop into VS and adjust the font-sizes so I can see whats going on.