div hover background-color change?
CssHtmlHoverCss Problem Overview
How can I make it act as if a line of div is anchor so when I hover on it it returns to red
CSS
.e
{
width:90px;
border-right:1px solid #222;
text-align:center;
float:left;
padding-left:2px;
cursor:pointer;
}
.f .e
{
background-color:#F9EDBE;
}
HTML
<div>
<div class="e" >Company</div>
<div class="e">Target</div>
<div class="e" style="border-right:0px;">Person</div>
</div>
<div class="f">
<div class="e">Company</div>
<div class="e">Target</div>
<div class="e" style="border-right:0px;">Person</div>
</div>
<div>
<div class="e">Company</div>
<div class="e">Targetaaa</div>
<div class="e" style="border-right:0px;">Person</div>
</div>
<div class="f">
<div class="e">Company</div>
<div class="e">Target</div>
<div class="e" style="border-right:0px;">Person</div>
</div>
Css Solutions
Solution 1 - Css
.e:hover{
background-color:#FF0000;
}
Solution 2 - Css
if you want the color to change when you have simply add the :hover pseudo
div.e:hover {
background-color:red;
}
Solution 3 - Css
div hover background color change
Try like this:
.class_name:hover{
background-color:#FF0000;
}
Solution 4 - Css
<html>
<head>
<style>
.e {
width:90px;
border-right:1px solid #222;
text-align:center;
float:left;
padding-left:2px;
cursor:pointer;
}
e2:hover {
background-color:red;
}
</style>
</head>
<body>
<div>
<div class="e e2" >Company</div>
<div class="e e2">Target</div>
<div class="e e2" style="border-right:0px;">Person</div>
</div>
</body>
</html>