...

View Full Version : <a> image border issue (this should be quick to solve)



johndove523
08-20-2010, 09:03 PM
...for anyone who knows more than me. : )

Please see url: http://backstageweb.net/2011/web.htm

(image links hair, cat eyes, guy)

I can't quite get this a:hover border effect right. I'm satisfied with what I have in FF, but in IE I have that awful default blue border. What I'm really trying to emulate here is the same border style as the demo this stylesheet is from (class="demo" in original, changed to "main.web in my css):

http://www.pirolab.it/pirobox/demo5.html

Can someone get me straight on this? Here's the code in question:


#main.web {
float:right;
background: url(../images/main_webbkgrnd.jpg) top left no-repeat;
margin:0;
padding:20px 30px;
width:658px; /*718 minus 60 padding=658*/
height:534px; /*574 minus 40 padding=534*/
}

#main.web a {
float:left;
margin:0;
padding:0;
margin:5px 0px 5px 13px!important;
margin:5px 10px 5px 10px;
display:block;
border:3px solid #efefef;
}

#main.web a:hover{border:3px solid #fff}

#main.web a img {
float:left;
margin:0;
padding:0;
margin:0;
background:url(../images/demo5/bg_tms.jpg) no-repeat;
color:transparent;
}

Thanks,

John

karlosio
08-21-2010, 02:03 AM
How about this:



a img { border:0; }


Then you should be able to apply a border to the images using the #main.web a declaration



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum