I am working on designing a website, and I am trying to keep everything on the website looking as well normal as it should, on as many different screens as possible. Because of this, I have been pretty selective of the XHTML and CSS I have been using, and I have also been sticking to the EM unit of measurement with a 16px base. It is used for my padding, my margins, my widths and heights, and obviously the text sizes as well. This has allowed me to create an extremely fluid and zoom-friendly layout... until I had the following problem:
I would like to use the angle quotation marks (», », ») for a bulleted navigation list; however, I can't think of any semantic way of implementing it.
Here are the only options I really see:
1) Create a GIF of the image and use it as the CSS list-style image. Not really what I want to do, because it will not resize with the rest of the page.
2) Create a GIF image, and embed it before the anchor tags, applying a 1em height to it and an auto width. doing so will allow it to resize with the space available to it.
3) Insert the character before the named anchor, then using the li{} style to change how it appears, and sue the li a{} to style the anchor element. The main problem with this is that my li a{} elements are block style, so they consume 100% width. I suppose I could adjust this to an em'd width, but I wish there were an easier way to do this such as...
4) Have someone on EE tell me that there is some way to define a specific character to use as a bulleted list's marker.
Start Free Trial
