CSS navigation with lists

Originally Posted by Andy text-indent: -99999px is something I truely hate - infact I hate pretty much all text replacements (ie an image where it should be text). If you're coding to be user friendly you really aren't by using an image where it should be text.

ok, but say for your comany's brand image you've selected an uncommon cursive font. your want to use it for all your headlines to create a consistant design to match your print media (think business card, brochure). there's no clear cut, black and white way to do something. sometimes text indent is used neddlessly, sometimes it actually acocmplishes something. i say let the user decide.

all jokes aside, hasn't the whole i'm so leet because i use xhtml and css instead of an image fad died yet? it always bothered me.

Originally Posted by dereklapp ok, but say for your comany's brand image you've selected an uncommon cursive font. your want to use it for all your headlines to create a consistant design to match your print media (think business card, brochure). there's no clear cut, black and white way to do something. sometimes text indent is used neddlessly, sometimes it actually acocmplishes something. i say let the user decide. all jokes aside, hasn't the whole i'm so leet because i use xhtml and css instead of an image fad died yet? it always bothered me.

Most of us use technologies as needed, and where appropriate... Fo rexample, an entirely flash based, text oriented site is just stupid.

Originally Posted by derek lapp ok, but say for your comany's brand image you've selected an uncommon cursive font. your want to use it for all your headlines to create a consistant design to match your print media (think business card, brochure). there's no clear cut, black and white way to do something. sometimes text indent is used neddlessly, sometimes it actually acocmplishes something.

If you wanted to embed a font into your page, I would reccomend using sIFR. It uses javascript in combination with CSS and Flash to replace text with any font of your choice.

As far as using lists goes, check out these lists to know what I believe the best way to do navigation. One image, one stylesheet, and we added the extra conditioning to achieve the hover stay for each color tab. Drop-downs can be done entirely with CSS and lists, but Stu Nichol's table method can be used if you want the neat hover stay effect.
A clear choice IMO.

EDIT: sorry the code is a bit spaced out, as it is generated by a CMS.

It doesn't matter whether it is an unordered list or an ordered list, if you style it the same, it will look the same.
HTMLGuy

Originally Posted by HTMLGuy It doesn't matter whether it is an unordered list or an ordered list, if you style it the same, it will look the same. HTMLGuy

Yeah who needs semantic markup, not us XHTML coders, right? Oh wait that's the reason we're here. Unless you are listing FAQ links or a table of contents, I don't see an ordered list being near as appropriate as an unordered list.

An ordered list is no different than an unordered list if styled right. There is not a person out there who will tell you that you coded something wrong by using an ol instead of an ul.
HTMLGuy

Originally Posted by HTMLGuy An ordered list is no different than an unordered list if styled right. There is not a person out there who will tell you that you coded something wrong by using an ol instead of an ul. HTMLGuy

I would. If the list is meant in order, use an ordered list. Otherwise, use an unordered list. Makes sense to me!

Yea, it makes sense to do it that way, I was just saying that it really doesn't matter unless he wants numbers or bullets in front of his items. Think about it... I can make an ol look like an ul by adding this to the css...
I wasn't saying you should, I was just saying that you could.
HTMLGuy

I no longer use "text-indent:-9999px;". I code it like this:

<li class="home"><a href="index.php" title="Home"><span>Home</span></a></li>

Then put "display:none;" on the spans.