h3 hover

karansokhey

01-25-2007, 04:03 AM

How would I make text underline in h3?

My HTML looks like this:

<h3 class="block-click"><div class="title-name">New Albums</div></h3>

css looks like this:

h3 {
font:normal 100% Arial, sans-serif;
font-size:25px;
color: #fff;
height:30px;
margin: 5px 0px 0px 0px;
padding:5px;
letter-spacing:2px;
cursor:pointer;
}

How would I make it so when you take your mouse over the h3 the text underlines?

ConnorB

01-25-2007, 04:04 AM

Here's the code:

h3:hover {
text-decoration: underline;
}

karansokhey

01-25-2007, 04:07 AM

Thought I tried that.

Thank you friend =)

_Aerospace_Eng_

01-25-2007, 04:46 AM

Hmm that will only work in browsers that aren't IE6. From the sounds of things though you intend on using onclick on the h3 or the div in order to make it a link. If that is the case then you are going about this the wrong way.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
html, body {
margin:0;
padding:0;
background:#000;
}
h3.block-click {
font:normal 100% Arial, sans-serif;
font-size:25px;
line-height:30px;
letter-spacing:2px;
margin:5px 0 0;
padding:5px;
background:#CCC;
}

h3.block-click a {
color:#FFF;
display:block;
text-decoration:none;
}

h3.block-click a:hover {
text-decoration:underline;
}
</style>
</head>

<body>
<h3 class="block-click"><a href="#">New Albums</a></h3>
</body>
</html>

ConnorB

01-25-2007, 04:55 AM

Hm. I didn't know that.