468,290 Members | 2,104 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 468,290 developers. It's quick & easy.

CSS Dashed Underline for Links

I am trying to build a new personal homepage and decided to try using
CSS for the first time. I came across some dashed underlines for links
on this page (and several others):

http://www.mezzoblue.com/zengarden/resources/

How do you do this? It's not one of the defined text-decorations, so
I'm not sure how to do it? You don't have to use dashed borders like
you would in a table would you (i.e. somehow make a table around every
link and make the bottom border dashed).
Let me know your thoughts.

Thanks

Jul 21 '05 #1
3 132033
On 23 Jan 2005 01:57:50 -0800, LadyKnight <lk*******@gmail.com> wrote:
I am trying to build a new personal homepage and decided to try using
CSS for the first time. I came across some dashed underlines for links
on this page (and several others):
How do you do this?


a:link {
text-decoration:none;
border-bottom:1px dotted $color; }

--
,-- --<--@ -- PretLetters: 'woest wyf', met vele interesses: ----------.
| weblog | http://home.wanadoo.nl/b.de.zoete/_private/weblog.html |
| webontwerp | http://home.wanadoo.nl/b.de.zoete/html/webontwerp.html |
|zweefvliegen | http://home.wanadoo.nl/b.de.zoete/html/vliegen.html |
`-------------------------------------------------- --<--@ ------------'
Jul 21 '05 #2
*Barbara de Zoete* <b_********@hotmail.com>:

a:link {
text-decoration:none;
border-bottom:1px dotted $color; }


That of course works, but actually it's still just a hack to get the
desired appeareance in current browsers with current standards.

a:link {
text-decoration: underline;
text-underline-style: dotted;}

or something equivalent would be more appropriate. If it was specified and
working yet.

<http://www.w3.org/TR/css3-text/#text-decoration-style>

--
"Censorship, like charity, should begin at home;
but, unlike charity, it should end there."

Clare Booth Luce
Jul 21 '05 #3
On Mon, 24 Jan 2005 00:29:28 +0100, Christoph Paeper
<ch**************@nurfuerspam.de> wrote:
*Barbara de Zoete* <b_********@hotmail.com>:

a:link {
text-decoration:none;
border-bottom:1px dotted $color; }
That of course works, but actually it's still just a hack to get the desired
appeareance in current browsers with current standards.


Well, yes. AOL and all.
a:link {
text-decoration: underline;
text-underline-style: dotted;}

or something equivalent would be more appropriate. If it was specified and
working yet.

But that's quite a big 'if'.
<http://www.w3.org/TR/css3-text/#text-decoration-style>


Wouldn't hold my breath. I'm still waiting for a full, ah no, forget full ...
for a correct implementation of CSS2

--
,-- --<--@ -- PretLetters: 'woest wyf', met vele interesses: ----------.
| weblog | http://home.wanadoo.nl/b.de.zoete/_private/weblog.html |
| webontwerp | http://home.wanadoo.nl/b.de.zoete/html/webontwerp.html |
|zweefvliegen | http://home.wanadoo.nl/b.de.zoete/html/vliegen.html |
`-------------------------------------------------- --<--@ ------------'
Jul 21 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

2 posts views Thread by Ed | last post: by
17 posts views Thread by Rickard Lindhé | last post: by
1 post views Thread by LadyKnight | last post: by
29 posts views Thread by jmaxsherkimer | last post: by
2 posts views Thread by Jeff | last post: by
4 posts views Thread by Mr. Newt | last post: by
10 posts views Thread by Michael7 | last post: by
2 posts views Thread by MrBee | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.