Hi!

 

See this code below:

 

#sectionTwoWrapper img {
margin: 0px 20px 0px 0px;
float: left;
width: 254px;
}
#sectionTwoWrapper a {
display: inline;
}
#sectionTwoWrapper a:link, #sectionTwoWrapper a:visited {
display: inline;
}
#sectionTwoWrapper a:hover, #sectionTwoWrapper a:active {
display: inline;
background: #FFF;
opacity: 0.5;
}

 

I have some images (as links to other pages in my site) sitting in 'sectionTwoWrapper'. All I want is to have a little hover effect on them but I cannot make it work!! I've never had this problem before and I just can't figure it out. Can anyone see any error in my code?

 

Help!!

 

Thank you!

Edited February 7, 201214 yr by Renaissance-Design
Please use the code button or tags to format your code.

You shouldn't need to set display: inline on your <a> elements - they're already inline.

 

Do you have a live link to the site? If not, can you put your code in a jsfiddle?

Edited February 7, 201214 yr by Renaissance-Design

Afraid not, I'm designing it locally.

 

You'll have to explain what a jsfiddle is - I'm new to this sorry!

If I wrap them in their own containers, the hover effect works perfectly.

 

Is there a reason for this?

jsfiddle