Welcome to WebmasterWorld Guest from 54.226.2.31

Forum Moderators: not2easy

Message Too Old, No Replies

Stylising a text link

Adding CSS style to a link

     

SteveHi

12:52 am on Apr 3, 2014 (gmt 0)



Hello

I have the following in my <head> tags:

<style type="text/css">

form button {
background:none;
border:none;
color:#BD2CBB;
text-decoration:none;
cursor:pointer;
outline:none;

a:link {background: #BD2CBB; text-decoration: none;}
a:visited {background: #BD2CBB; text-decoration: none;}
a:hover {text-decoration: underline; color: #BD2CBB;}
a:active {background: #BD2CBB; text-decoration: none;}
}
</style>


and this text-link in my HTML:

<input id="submitlink" type="text" name="Email" />
<button type="submit">Request password</button>


When the mouse passes over the text 'Request password', I would like the text to be underlined in the colour #BD2CBB.

How would I do that, please?

Thank you.

Steve H

brandozz

1:44 pm on Apr 3, 2014 (gmt 0)



You have the closing bracket for the "form button" styles in the wrong place, it should be before the a:link styles and do you have the input and button wrapped in a form?

rainborick

3:14 pm on Apr 3, 2014 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



brandozz is right that your CSS has errors. Try:

<style type="text/css">

form button {
background:none;
border:none;
color:#BD2CBB;
text-decoration:none;
cursor:pointer;
outline:none;
}

form button:hover {
text-decoration:underline;
}

</style>

SteveHi

3:25 pm on Apr 3, 2014 (gmt 0)



Hello brandozz and rainborick

Yes, the input and button and in a 'lost password' <form></form>.

I have tried the code that rainborick kindly submitted and IT WORKS!

Thank you. I'm ever so grateful.

Thanks again to you both!

Steve
 

Featured Threads

Hot Threads This Week

Hot Threads This Month