i'm trying to put a border around a navigational arrow , when you pass your mouse over it. i've tried to put a border around the hover link, but it doesn't seem to work.
here's my code, what am i doing wrong?
a.arrow:link {text-decoration: none;
margin-top:62px }
a.arrow:hover img { border-color:#00FFFF;
border: 2px #00FFFF;}
div.arrowcontainer {margin-left:294px}
<body>
<div class="arrowcontainer">
<a class="arrow" href=http://www.webdeveloper.com/forum/archive/index.php/"153.html"><img
border= "0" src=http://www.webdeveloper.com/forum/archive/index.php/"images/buttonvioletl.gif"></a>
<a href=http://www.webdeveloper.com/forum/archive/index.php/"154.html"><img border="0" src="images/buttonviolet.gif"></a>
</div>I suspect the border="0" within the img tag is overriding your style. Try this for your style section, and delete the border="0" from that img tag:
a.arrow img {
border: none;
padding: 2px;
}
a.arrow:hover img {
border: solid 2px red;
padding: 0;
}that doesn't seem to work. someone else said , it's because of my browser (I.E.) i have a different question regarding html. do you know how i would make a link inactive , so that when the mouse passes over it, it doesn't seem to be a link anymore. the cursor wouldn't change. i tried to put "//", but it doesn't seem to work. i want to keep the link, but have it inactive, until i change it later on.<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">link text</a>that doesn't seem to do it. i still get the active link (the cursor changes) , when i pass my mouse over it.
here's my code, is this correct:
<div>
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#"><img src="images/buttonviolet.gif"></a>
</div>
here's my code, what am i doing wrong?
a.arrow:link {text-decoration: none;
margin-top:62px }
a.arrow:hover img { border-color:#00FFFF;
border: 2px #00FFFF;}
div.arrowcontainer {margin-left:294px}
<body>
<div class="arrowcontainer">
<a class="arrow" href=http://www.webdeveloper.com/forum/archive/index.php/"153.html"><img
border= "0" src=http://www.webdeveloper.com/forum/archive/index.php/"images/buttonvioletl.gif"></a>
<a href=http://www.webdeveloper.com/forum/archive/index.php/"154.html"><img border="0" src="images/buttonviolet.gif"></a>
</div>I suspect the border="0" within the img tag is overriding your style. Try this for your style section, and delete the border="0" from that img tag:
a.arrow img {
border: none;
padding: 2px;
}
a.arrow:hover img {
border: solid 2px red;
padding: 0;
}that doesn't seem to work. someone else said , it's because of my browser (I.E.) i have a different question regarding html. do you know how i would make a link inactive , so that when the mouse passes over it, it doesn't seem to be a link anymore. the cursor wouldn't change. i tried to put "//", but it doesn't seem to work. i want to keep the link, but have it inactive, until i change it later on.<a href=http://www.webdeveloper.com/forum/archive/index.php/"#">link text</a>that doesn't seem to do it. i still get the active link (the cursor changes) , when i pass my mouse over it.
here's my code, is this correct:
<div>
<a href=http://www.webdeveloper.com/forum/archive/index.php/"#"><img src="images/buttonviolet.gif"></a>
</div>