Two boxes with diffrent Styles for <a href>

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

Frank Reintgen - 30 Oct 2004 11:19 GMT

Hallo!
(Soory for my english ;-) )
I have create a style like this:

a:link { text-decoration:none; font-weight:bold; color:red; }
a:visited { text-decoration:none; font-weight:bold; color:#ff0033;}
a:hover { text-decoration:none; font-weight:bold;
background-color:#FFF000; }
a:active { text-decoration:none; font-weight:bold;
background-color:#CCFFFF; }

Also I have create a few boxes like:
#box1 { position:absolute; top:0px; left:0px; width:200px; height:200px;
z-index:1; background-color:#FFFccc; }

/* box 2 = Menuleiste */
#box2 { position:absolute; top:200px; left:0px; width:200px; height:auto;
z-index:2; background-color:#000666}

My Question:
is it possible to create a spezial Definition for a spezial box, so that in
box1 Links are coloured red (a:link {color:red; })
and in box2 Links are coloured blue

Frank

Reply to this Message

Lachlan Hunt - 30 Oct 2004 11:54 GMT

> Also I have create a few boxes like:
> #box1 { ... }
[quoted text clipped - 6 lines]
> box1 links are coloured red (a:link {color:red; })
> and in box2 links are coloured blue

Use styles like this:

#box1 a:link { color: red; }
#box1 a:visited { ... }
...
#box2 a:link { color: blue; }
...

Signature

Lachlan Hunt
http://lachy.id.au/
http://GetFirefox.com/ Rediscover the Web
http://SpreadFirefox.com/ Igniting the Web

Reply to this Message

Frank Reintgen - 30 Oct 2004 14:34 GMT

> Use styles like this:
>
> #box1 a:link { color: red; }
> #box1 a:visited { ... }
> ...
> #box2 a:link { color: blue; }

Sorry but this doesn't work.

ButI try to use "classes" and this works:
a.box { text-align:center; text-decoration:none; vertical-align: top; }

a.box:link { color:blue; background-color:transparent; }
a.box:visited { color:blue; background-color:transparent; }
a.box:hover { color:blue; background-color:white; }
a.box:active { color:#ff0; background-color:#a03; }

Thank you for help

Frank
I Use cl

Reply to this Message

Lauri Raittila - 30 Oct 2004 14:46 GMT

> > Use styles like this:
> >
[quoted text clipped - 4 lines]
>
> Sorry but this doesn't work.

Yes it does. You just had mistake somewhere, which we can't know whitout
URL. Are you sure you didn't change your html?

> ButI try to use "classes" and this works:
> a.box { text-align:center; text-decoration:none; vertical-align: top; }
[quoted text clipped - 3 lines]
> a.box:hover { color:blue; background-color:white; }
> a.box:active { color:#ff0; background-color:#a03; }

But now you need to add class to every A element. Not good idea.

Signature

Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>

Reply to this Message

Webmaster Forum / HTML, CSS, Scripts / CSS / October 2004

Two boxes with diffrent Styles for <a href>