CSS styling through HTML element attributes
Whilst searching for an efficient and effective way of creating print stylesheets for some whitepapers we are releasing at work I found a new way to control HTML elements with CSS.
By styling the attribute value of a HTML element I have found that it reduces the need to add ID and class values to HTML elements just for them to be styled through CSS.
In a project that I am currently working on, there are just two content images; one needs to be aligned to the left, the other to the right. They need to have different margins around them to separate the images from the text. I used to add clases in situations such as these, however I can now style them through defining the CSS img[align="left"] and img[align="right"].
Makes things much easier.
One comment to “CSS styling through HTML element attributes”
Good stuff! Just used it on the document I’m marking up–the doctype that I’m using (teilite) is pretty austere if you want to use it properly. But the <add> element (used to mark words that authors have added into their manuscripts) has a “place” attribute that tells whether they added it at the top, bottom, &c. So now I can use this to float stuff where it ought to be, without adding evil classes. Cheers a lot, Scott!
Tom at 10.11 pm
on Monday 21st August 2006