[thelist] I've found a great use for <span>

Jim Dabell jim-lists.evolt.org at jimdabell.com
Fri Aug 2 08:22:00 CDT 2002


-----BEGIN PGP SIGNED MESSAGE-----
Hash: SHA1


On Thursday 01 August 2002 3:01 pm, Simon Willison wrote:
[snip]
> Example 2: A horizontal menu
>
> Here we want to create a horizontal menu with a number of options in it.
> We want these options to have funky hover over effects, backgrounds,
> borders and generally look nice. In browsers that don't support CSS we
> want them to be seperated by pipes (this is also an accessibility issue -
> Bobby at al get annoyed if you have links with nothing seperating them
> apart from blank space). Here's the HTML:
>
> <div id="horizontalMenu">
> <a href="page1.html">Page 1</a><span> | </span>
> <a href="page2.html">Page 2</a><span> | </span>
> <a href="page3.html">Page 3</a><span> | </span>
> <a href="page4.html">Page 4</a><span>
> </div>
>
> And here's the CSS:
>
> div#horizontalMenu a {
>    display: block;
>    float: left;
>    width: 10em;
>    background-color: #f00;
> }
> div#horizontalMenu a:hover {
>    background-color: #ff0;
> }
> div#horizontalMenu span {
>    display: none;
> }

What would be wrong with:

<div id="horizontalMenu">
	<a href="page.html">Page1</a> |
	<a href="page.html">Page2</a> |
	<a href="page.html">Page3</a> |
	<a href="page.html">Page4</a>
</div>

and:

div#horizontalMenu * {
	display: none;
}

div#horizontalMenu a {
	display: block;
}

Just curious, I can't see any problem with specificity, and it seems fairly
understandable to me.

- --
Jim


-----BEGIN PGP SIGNATURE-----
Version: GnuPG v1.0.7 (GNU/Linux)

iD8DBQE9SoRt3tJNldoQhi8RAgQRAJ9YWfWlMVlADng6iJ/X1eckikBOtgCeNrK+
Cz2vpPUoQIwOE3C5aALfMNQ=
=2uci
-----END PGP SIGNATURE-----




More information about the thelist mailing list