By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,490 Members | 3,228 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,490 IT Pros & Developers. It's quick & easy.

change link colors in p class

P: n/a
hi,

i want to change my link colors in the p class="suchen":

That is my html:

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//DE"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Lippelt-B&auml;ckereimaschinen</title>
</head>
<body>
<!-- ###DOCUMENT_BODY### START-->
<div id="logo"><div align="right"><a href="http://www.lippelt-back.com"
target="_self"><img src="http://lippelt-back.com/file$
<div id="container"><div id="top">###ROOTLINE###</div></div>
<div id="leftnav">###CONTENT-LINKS###</div>
<div id="rightnav">###NAVI_LINKS###<p class="happy"></p><p
class="suchen">###INFO###</p></div>
<div id="content">###CONTENT-RECHTS###</div>
<div id="footer">###copyright### ###LAST###</div>
<div id="counter"></div>
<!-- ###DOCUMENT_BODY### STOP-->
</body>
</html>
i tested different options, but i was not able to change only the link
colors in the p class="suchen".

any hints?

cu denny
Jul 23 '05 #1
Share this Question
Share on Google+
18 Replies


P: n/a
Denny Schierz wrote:
i tested different options, but i was not able to change only the link
colors in the p class="suchen".


p.suchen a:link { color: ...; }
p.suchen a:visited { color: ...; }
p.suchen a:hover { color: ...; }
p.suchen a:active { color: ...; }

--
Mark.
http://tranchant.plus.com/
Jul 23 '05 #2

P: n/a
On Thu, 30 Sep 2004 17:18:16 +0200, Denny Schierz <cu***@gmx.de> wrote:
hi,

i want to change my link colors in the p class="suchen":

That is my html:
Don't post HTML, post a URL to a page showing the issue. Your code didn't
even have an anchor element in the classed p element.
i tested different options, but i was not able to change only the link
colors in the p class="suchen".

any hints?


p.suchen a:link {color: blue;}
p.suchen a:visited {color: purple;}
p.suchen a:hover {color: green;}
p.suchen a:active {color: red;}

Jul 23 '05 #3

P: n/a

"Denny Schierz" <cu***@gmx.de> wrote in message
news:cj*************@news.t-online.com...
hi,

i want to change my link colors in the p class="suchen":

That is my html:

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//DE"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Lippelt-B&auml;ckereimaschinen</title>
</head>
<body>
<!-- ###DOCUMENT_BODY### START-->
<div id="logo"><div align="right"><a href="http://www.lippelt-back.com"
target="_self"><img src="http://lippelt-back.com/file$
<div id="container"><div id="top">###ROOTLINE###</div></div>
<div id="leftnav">###CONTENT-LINKS###</div>
<div id="rightnav">###NAVI_LINKS###<p class="happy"></p><p
class="suchen">###INFO###</p></div>
<div id="content">###CONTENT-RECHTS###</div>
<div id="footer">###copyright### ###LAST###</div>
<div id="counter"></div>
<!-- ###DOCUMENT_BODY### STOP-->
</body>
</html>
i tested different options, but i was not able to change only the link
colors in the p class="suchen".


Would you like to tell us what you tried so we don't waste time duplicating
your own efforts?

Jul 23 '05 #4

P: n/a
hi,

Harlan Messinger schrieb:
Would you like to tell us what you tried so we don't waste time duplicating
your own efforts?


i tried somthing like that:

p suchen a:link {
color : #fd1613;
background : transparent;
text-decoration : none;
}

p suchen a:visited {
color : #fd1613;
text-decoration : none;
}

p suchen a:hover {
color : black;
text-decoration : underline;
}

p suchen a:active {
color : #e9e9e9;
text-decoration : none;
}

i've forgotten to set the point "." :-/

stupid error :-(

thanks a lot for helping

cu denny
Jul 23 '05 #5

P: n/a
Neal schrieb:
Don't post HTML, post a URL to a page showing the issue. Your code
didn't even have an anchor element in the classed p element.
sorry, i will do it in the future
p.suchen a:link {color: blue;}
p.suchen a:visited {color: purple;}
p.suchen a:hover {color: green;}
p.suchen a:active {color: red;}


thanks, it helps :-)
Jul 23 '05 #6

P: n/a
hi,

Mark Tranchant schrieb:
p.suchen a:link { color: ...; }
p.suchen a:visited { color: ...; }
p.suchen a:hover { color: ...; }
p.suchen a:active { color: ...; }


also for you, a big thank :-)

cu denny
Jul 23 '05 #7

P: n/a
On Thu, 30 Sep 2004 18:32:14 +0200, Denny Schierz <cu***@gmx.de> wrote:
hi,

Harlan Messinger schrieb:
Would you like to tell us what you tried so we don't waste time
duplicating
your own efforts?


i tried somthing like that:

p suchen a:link {
color : #fd1613;
background : transparent;
text-decoration : none;
}


Problem: How will this be recognized as a link? Recommend leaving
underline in, unless you otherwise make it painfully obvious these are
links.
Jul 23 '05 #8

P: n/a
hi,

Neal wrote:
Problem: How will this be recognized as a link? Recommend leaving
underline in, unless you otherwise make it painfully obvious these are
links.


you can see, how it looks:

http://www.lippelt-back.com/

you find it under the main menu on the right side. I change the colors so
everybody can see this links, without a underline. I use underline for
hover :-)

Did you find it painfull? but thanks for this hint :-)

cu denny
Jul 23 '05 #9

P: n/a
Denny Schierz <cu***@gmx.de> writes:
p suchen a:link {
color : #fd1613;
background : transparent;
text-decoration : none;
}

i've forgotten to set the point "." :-/


Apart from that, there's another problem.

You've specified a colour, but not a background colour [1] - so
there's a chance that there'll be problems with user colour settings.

[1] Transparent doesn't count, because that's the default anyway. I
*think* 'inherit' would work (and still do what you want), provided
there's a background colour set for something nearer the root element,
but I can't be certain - has anyone else tested inherit in these
conditions?

--
Chris
Jul 23 '05 #10

P: n/a
Chris Morris <c.********@durham.ac.uk> wrote in
news:87************@dinopsis.dur.ac.uk:
Denny Schierz <cu***@gmx.de> writes:
p suchen a:link {
color : #fd1613;
background : transparent;
text-decoration : none;
}

i've forgotten to set the point "." :-/


Apart from that, there's another problem.

You've specified a colour, but not a background colour [1] - so
there's a chance that there'll be problems with user colour settings.

[1] Transparent doesn't count, because that's the default anyway. I
*think* 'inherit' would work (and still do what you want), provided
there's a background colour set for something nearer the root element,
but I can't be certain - has anyone else tested inherit in these
conditions?

No that is not a problem. Transparent will override any user CSS for the
background and avoid problems with user color settings just fine. If the
underlying background color is not what the author expected (due to user
CSS, for instance), then it's the user's fault for not having a CSS file
that includes
* { color: inherit !important; background: inherit !important; }

If inherit works without problems, then transparent certainly will.
Jul 23 '05 #11

P: n/a
Sam Hughes <hu****@rpi.edu> writes:
Chris Morris <c.********@durham.ac.uk> wrote:
You've specified a colour, but not a background colour [1] - so
there's a chance that there'll be problems with user colour settings.

[1] Transparent doesn't count, because that's the default anyway. I
*think* 'inherit' would work (and still do what you want), provided
there's a background colour set for something nearer the root element,
but I can't be certain - has anyone else tested inherit in these
conditions?
No that is not a problem. Transparent will override any user CSS for the
background and avoid problems with user color settings just fine. If the
underlying background color is not what the author expected (due to user
CSS, for instance), then it's the user's fault for not having a CSS file
that includes
* { color: inherit !important; background: inherit !important; }


That's the last thing I'd put in a user CSS file! I do like having
some things (links, etc) a different colour...

author:
body { background: red; color: white; }
a { background: transparent; color: blue; }

user:
body { background: blue; color: white; }

Yes, the CSS rule you suggest above would fix this for the user, but
would also be a little extreme for the majority of user CSS files.
If inherit works without problems, then transparent certainly will.


And looking at this example, inherit wouldn't work either, so I was
wrong there. Both inherit and transparent are risky, then.

--
Chris
Jul 23 '05 #12

P: n/a
On Fri, 1 Oct 2004, Chris Morris wrote:
Sam Hughes <hu****@rpi.edu> writes:
No that is not a problem. Transparent will override any user CSS for the
background and avoid problems with user color settings just fine. If the
underlying background color is not what the author expected (due to user
CSS, for instance), then it's the user's fault for not having a CSS file
that includes
* { color: inherit !important; background: inherit !important; }


That's a bit strong, and wouldn't work for older CSS implementations,
but it's an interesting point of view. I haven't quite seen it put
that way before; I'd like to explore the idea more before deciding
on its implications.
That's the last thing I'd put in a user CSS file! I do like having
some things (links, etc) a different colour...


Oh, I'm sure Sam meant for that to take effect just where no
more-specific coloring had been used in the user stylesheet.

And, where higher-specificity user style properties are written,
explicit text colour should always be accompanied by explicit
background colour, and vice versa, just as the "traditional" design
rule taught.

Jul 23 '05 #13

P: n/a
Chris Morris <c.********@durham.ac.uk> wrote in
news:87************@dinopsis.dur.ac.uk:
Sam Hughes <hu****@rpi.edu> writes:
If the underlying background color is not what the author expected
(due to user CSS, for instance), then it's the user's fault for not
having a CSS file that includes
* { color: inherit !important; background: inherit !important; }
That's the last thing I'd put in a user CSS file! I do like having
some things (links, etc) a different colour...


I mean that would be at the top. Then it would get overruled as various
elements such as links got styled with their colors.

So I'll modify your quote by putting my little rule up top and changing
some things:

author:
* { color: inherit !important; background: inherit !important; }
body { background: red !important; color: white !important; }
a { background: transparent !important; color: blue !important; }

user:
body { background: blue; color: white; }

This results in white on red.
And looking at this example, inherit wouldn't work either, so I was
wrong there. Both inherit and transparent are risky, then.


Only if the user makes his style sheet poorly, which is his/her own
responsibility.
Jul 23 '05 #14

P: n/a
On 1 Oct 2004 12:24:31 GMT, Sam Hughes <hu****@rpi.edu> wrote:
* { color: inherit !important; background: inherit !important; }


!important in a author stylesheet only overrides author or user styles not
marked with !important. User !important will override everything.
Jul 23 '05 #15

P: n/a
Neal <ne*****@yahoo.com> wrote in
news:op**************@news.individual.net:
On 1 Oct 2004 12:24:31 GMT, Sam Hughes <hu****@rpi.edu> wrote:
* { color: inherit !important; background: inherit !important; }


!important in a author stylesheet only overrides author or user styles
not marked with !important. User !important will override everything.


That's pretty much the whole idea.
Jul 23 '05 #16

P: n/a
On 2 Oct 2004 00:10:00 GMT, Sam Hughes <hu****@rpi.edu> wrote:
Neal <ne*****@yahoo.com> wrote in
news:op**************@news.individual.net:
On 1 Oct 2004 12:24:31 GMT, Sam Hughes <hu****@rpi.edu> wrote:
* { color: inherit !important; background: inherit !important; }


!important in a author stylesheet only overrides author or user styles
not marked with !important. User !important will override everything.


That's pretty much the whole idea.


I see now, I misread. Well, the clarification was likely useful to
somebody...
Jul 23 '05 #17

P: n/a
Sam Hughes <hu****@rpi.edu> writes:
Chris Morris <c.********@durham.ac.uk> wrote in
news:87************@dinopsis.dur.ac.uk:
Sam Hughes <hu****@rpi.edu> writes:
If the underlying background color is not what the author expected
(due to user CSS, for instance), then it's the user's fault for not
having a CSS file that includes
* { color: inherit !important; background: inherit !important; }
That's the last thing I'd put in a user CSS file! I do like having
some things (links, etc) a different colour...


I mean that would be at the top. Then it would get overruled as various
elements such as links got styled with their colors.

So I'll modify your quote by putting my little rule up top and changing
some things:

author:
* { color: inherit !important; background: inherit !important; }


I note you've put this in the author CSS file - the impression I got
above was that you expected it in the user CSS.
body { background: red !important; color: white !important; }
a { background: transparent !important; color: blue !important; }

user:
body { background: blue; color: white; }

This results in white on red.


Well, obviously - author !important overrides user normal.
And looking at this example, inherit wouldn't work either, so I was
wrong there. Both inherit and transparent are risky, then.


Only if the user makes his style sheet poorly, which is his/her own
responsibility.


Bear in mind that user CSS is probably a lot rarer than changing the
default background/colour combinations in the browser - which only
affects body. (Unless 'ignore author colours' or the equivalent is
checked, in which case it makes absolutely no difference what's in the
author stylesheet [1].

[1] A couple of browser bugs notwithstanding.

--
Chris
Jul 23 '05 #18

P: n/a
Chris Morris <c.********@durham.ac.uk> wrote in
news:87************@dinopsis.dur.ac.uk:
Sam Hughes <hu****@rpi.edu> writes:
author:
* { color: inherit !important; background: inherit !important; }
I note you've put this in the author CSS file - the impression I got
above was that you expected it in the user CSS.


Oh right, I got mixed up.
Bear in mind that user CSS is probably a lot rarer than changing the
default background/colour combinations in the browser - which only
affects body. (Unless 'ignore author colours' or the equivalent is
checked, in which case it makes absolutely no difference what's in the
author stylesheet [1].

[1] A couple of browser bugs notwithstanding.


I notice that Mozilla will set the body background color, but then it will
make the backgrounds of other things transparent. This is bad for items
such as drop down menus - text gets overlapping.

Jul 23 '05 #19

This discussion thread is closed

Replies have been disabled for this discussion.