WebAIM - Web Accessibility In Mind

E-mail List Archives

RE: Drop down list, css, and xhtml


From: Trusz, Andrew
Date: Apr 24, 2006 7:50AM


From: smithj7 Sent: Thursday, April 20, 2006 7:09 PM
Subject: [WebAIM] Drop down list, css, and xhtml

don't laugh... but I was happy to discover that I can even set up a css
style for drop down boxes which I use more or less to assist users to
get quickly from one item to ...

While this is a specific question, I'm not quite sure if I fully grasp
when it is better in the css style sheet to use the class that sets a
division verses the class that sets an individual item. (the pound
symbol verses the dot symbol and/or genric H1, H2...). ...

My understanding from programming CLASSES (c++ and java) is that
inheritancy is the rule in a style sheet. So I think you could set up a
p class with many values, then within a division class only change
something that would differ from this p class. The other items would
default to the p class description. ...

He..he.. I'm also changing my site to comply with xhtml and have been
reading about it as well as xml. I'm going through the slow process of
conversion now.

As a digest reader I tend to be far enough behind that comments aren't
usually worth making but in this case a few additions seem warranted.

Id's and classes differ in a couple of ways. The most obvious is that
id's can be used only once per page while classes can be repeated. Id's
can also be used as an anchor. An h1 with an id can therefore be used as
an anchor to refer users to a particular section or page.

Divs were developed as a flexible container. They are often used for
visual effects - positioning. Often this involves using id's such as
#logo, #header, #nav, #main and #footer. The content divs can hold runs
the gamut of elements. Raw text (no other containing element) can be
dumped in a div. Certainly images, lists, forms and even tables can be
contained in div. In fact a div can contain nothing, being used to clear
other elements. Divs are the building blocks.

Cascading (inheritance) takes some getting used to. How rules are
applied depends upon a very specific algorithm for calculating
specificity. This included counting the number of id's, classes and tags
involved. Last applied rules mean you'll see some intricate
constructions to achieve a specific effect.

In working your way through all of this, you might want to look at these


While css1 has been superseded by css2.1, it is subsumed in 2.1 and
since it is a shorter, less complex version of css it's easier to sort
through. It introduces the underlying principles without be so extensive
it makes your head hurt.

When you get to wrestling with positioning, two possible aids would be


It's an older document but it still illustrates the basics. For more
complicated issues of how to do layouts, the "layout demos" at

<http://www.positioniseverything.net/>; are very good. The site can
also introduce you to some of the "issues" raised by IE.

It's an often frustrating conversion process but well worth in the end
for the reasons you've already discovered and more.