CSS IE Help

[Johnboat]

Hey guys I'm new to the forum. I'm redesigning my site and I'm having an IE issue. If you could go to www.jpconcepts.net/wp/portfolio/web/ and look at it in Firefox or Opera and IE, you'll notice the border around the images don't hover like they do in FF and Opera. Also under the Sites that are offline you'll see that those don't work in IE also, in fact they don't work in Opera either. Just wondering if someone can give me a hand with this. I'm fairly good with CSS but when problems arise I still need to learn how to fix them sometimes.

[aspnetguy]

for the hover image borders, how are they defined? Do you use :hover on an element other than <a>?IE only recognizes a:hover and will not work with img:hover or any other element. That is my first guess.As for the "Offline Sites" what is the JS or CSS code that does that effect?

[S@m]

Well, I'm not sure if this will work or not.Here is your css:

<div id="portpic"><ul><li><a href="http://www.albertbell.com"><img alt="Albert Bell" id="image24" src="http://www.jpconcepts.net/wp/wp-content/uploads/2006/10/abell.jpg" /></a></li><li><a href="http://www.acutekservices.com/"><img id="image26" alt="Acutek Services" src="http://www.jpconcepts.net/wp/wp-content/uploads/2006/10/acutek.jpg" /></a></li><li><a href="http://www.aromech.com/"><img id="image27" alt="Aromech" src="http://www.jpconcepts.net/wp/wp-content/uploads/2006/10/aromech.jpg" /></a></li><li><a href="http://www.balancedblade.net/"><img id="image28" alt="Balanced Blade" src="http://www.jpconcepts.net/wp/wp-content/uploads/2006/10/bblade.jpg" /></a></li><li><a href="http://www.saugatuckmusic.org/"><img alt="Chamber Music Festival of Saugatuck" id="image29" src="http://www.jpconcepts.net/wp/wp-content/uploads/2006/10/cmfos.jpg" /></a></li><li><a href="http://www.johnsonsroofingllc.com/"><img id="image30" alt="Johnsons Roofing LLC" src="http://www.jpconcepts.net/wp/wp-content/uploads/2006/10/johnsonsroofing.jpg" /></a></li><li><a href="http://home.filertel.com/%7Edonlp/"><img alt="Don Peters: Amsoil Dealer" id="image31" src="http://www.jpconcepts.net/wp/wp-content/uploads/2006/10/amsoil.jpg" /></a></li><li><a href="http://www.premierdetailing.net/"><img id="image32" alt="Premier Auto & RV Detailing" src="http://www.jpconcepts.net/wp/wp-content/uploads/2006/10/premier.jpg" /></a></li><li><a href="http://www.westmichiganmoms.net/"><img id="image33" alt="West Michigan Moms" src="http://www.jpconcepts.net/wp/wp-content/uploads/2006/10/wmmjpg.jpg" /></a></li></ul></div>

CSS:

#portpic ul {list-style-type:none;}#portpic ul li {padding-top:1-px;}#portpic a {border:5px solid #ccc;}#portpic a:hover {border:5px solid #993300;}

You might want to check that over, I'm not sure If I have everything correct there. I also changed the class to an id. Depending if you need another instance of it, you will need to keep it a class. Things like that can really help to lighten up your pages. Hope this helps!*edit*You can do hover(s) but you will need to use JavaScript. I can help you out with that if the "a:hover" doesn't work out.

[Johnboat]

Hey thanks for the advise, I fixed the IE hover issue, it turns out I still need the img in the css or the border won't go around the image. I'll change my list next to see how that works. At first I did have it that way but when I moused over one it would hover over all the images. I had the class on the UL then and not the LI, I'll try it on the LI.

[Johnboat]

for the hover image borders, how are they defined? Do you use :hover on an element other than <a>?IE only recognizes a:hover and will not work with img:hover or any other element. That is my first guess.As for the "Offline Sites" what is the JS or CSS code that does that effect?

I'm using CSS for the Offline sites. I don't know javascript and I don't have a real interest in knowing it. I love CSS I just need to become more efficent with it and yes I do have a lot more learning of CSS to do. Anyway any clues on the offline sites. What I did was took the tooltip tutorial out of my CSS Mastery book and just incorporated it to those 4 images.

[Johnboat]

Anyone on this?