Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations gkittelson on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

link colors and form elements

Status
Not open for further replies.

safra

Technical User
Jan 24, 2001
319
NL
Hi,

In my page I would like to control colors for url links using style definitions.

for example:

A:hover { color:#FFFFFF; }
A:active { color:#003352; }
A:link { color:#E9F3FE; }
A:visited { color:#E9F3FE; }


What happens is that if an url is visited the hover definition is not working anymore!

Why not? and what can I do about this? An what is the exact meaning of 'active'? I can't notice any changes except from rollover, and link visited!

Another question is there a way to change the background of buttons, checkboxes and lists/menus like it is for buttons anmd textfields?

regards,

Ron

Ron

 
You could override the anchor <a with a stylesheet

.TARIFF A {
text-decoration: none; cursor: auto; font: 18px Arial, Helvetica, sans-serif; color: #000000
}

Like that, then use
<span class=&quot;TARIFF&quot;><a href=&quot;whereever.htm&quot;>somethin to link to</a></span>

Okey doke.
 
Pull the active attribute out and see what happens then. From what I can see, there is no reason hover should not be working. Active represents a link that is currently being visited. Kevin
slanek@ssd.fsi.com
 
if you want to keep the same color for your link after it has been visited just give it the same color. IE:

A:hover { color:#E9F3FE; }
A:active { color:#003352; }
A:link { color:#E9F3FE; }
A:visited { color:#E9F3FE; }

And ACTIVE means the LAST CLICKED link.

BobbaFet

 
To correct BobbaFet, I'll have to agree with KevinFSI as far as the definition of ACTIVE. If you right-click on a link or tab through links, you see the active link color because that link is &quot;active&quot; (in use, whatever). Perhaps what BobbaFet meant is that if you click on a link and then press the BACK button, the link you clicked last will be the active link. Liam Morley
imotic@hotmail.com
&quot;light the deep, and bring silence to the world.

light the world, and bring depth to the silence.&quot;
 
thanks all of you! I figured the first question out myself. I just couldn't find out how to name those definitions and how to use them in the html. But it is exactly how gsc1ugs described. I was making it to difficult!

So, active is true when I have a link on a page that refers to this page. I'll try that!

I guess my last question about backgroundcolors for the specific form elements I mentioned is not possible?

Regards

Ron

 
Sure it is possible. Create either attributes for the INPUT element or create a class (for example .myInput) and specify attributes that way.

Also, you shouldn't have to deal with anchors by creating a separate class. In other words, in my most humble opinion, the way gsc1gus has you doing it is actually more difficult than it needs to be. There is no reason your original code won't work, then there would be no reason to encapsulate your links within <DIV> tags. Kevin
slanek@ssd.fsi.com
 

INPUT.button { background-color:#ff0033}

<input type=&quot;radio&quot; class = &quot;button&quot; name=&quot;radiobutton&quot; value=&quot;radiobutton&quot;>

or

<span class=&quot;button>&quot;<input type=&quot;radio&quot; name=&quot;radiobutton&quot; value=&quot;radiobutton&quot;></span>

not affecting the background color?

Ron
 
Take &quot;.button&quot; out of there and just have INPUT by itself. Taks the <SPAN> tag out as well. Let us know how it goes. Kevin
slanek@ssd.fsi.com
 
I'm sorry doesn't seem to work.

Ron
 
Here, I tried this before posting it. Works fine.
Code:
INPUT
{
	background-color: #DEB887;;
}

Then:
Code:
<INPUT TYPE=&quot;text&quot;>
Kevin
slanek@ssd.fsi.com
 
Here, I tried this before posting it. Works fine.
Code:
INPUT
{
	background-color: #DEB887;
}

Then:
Code:
<INPUT TYPE=&quot;text&quot;>
Kevin
slanek@ssd.fsi.com
 
If you do INPUT.button you need to specify CLASS=&quot;button&quot; from WITHIN the input tag and not the SPAN tag. i.e.


<input type=&quot;radio&quot; name=&quot;radiobutton&quot; value=&quot;radiobutton&quot; class=&quot;button&quot;>

INPUT.button means that only an INPUT tag can use the 'button' class. So if you try and do a <span class='button'> it will not work, unless you changed it either to .button or SPAN.button.

HTH,

Tiz
--
Tim <tim@planetedge.co.uk>
 
I tried all your suggestions but it doesn't work. But you are right KevinFSI. Your example works but only for text and button fields. I still can't find a way to use this for the other options like checkboxes, etc.

Ron
 
Not sure what to do about the checkboxes and radio buttons. If you add SELECT as an element to the stylesheet, and put the same background color info in, it will work for select boxes too. Kevin
slanek@ssd.fsi.com
 
Try just background:#cccccc instead of background-color. That's what I use to change to color of a button. You can also change to border color of a button with border-color:#xxxxxx and the color of the text on a button with color:#xxxxxx. Meddle not in the affairs of dragons,
For you are crunchy, and good with mustard.
 
Except from radio buttons and checkboxes they are all working now. The trick is to ad input,select or textarea to the element of the style but it doesn't make clear why it is not working for checkboxes and radiobuttons as those are input elements of a form?

Thanks for the help,

Ron
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top