Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    Jul 2008
    Posts
    114
    Thanks
    33
    Thanked 0 Times in 0 Posts

    <a> image border issue (this should be quick to solve)

    ...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:

    Code:
    #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

  • #2
    Regular Coder
    Join Date
    Dec 2006
    Location
    In the wilderness
    Posts
    106
    Thanks
    9
    Thanked 5 Times in 5 Posts
    How about this:

    Code:
    a img { border:0; }
    Then you should be able to apply a border to the images using the #main.web a declaration
    Last edited by karlosio; 08-21-2010 at 02:07 AM.
    "The advantage of computers is that they do exactly what you tell them to do. The disadvantage of computers, on the other hand, is that they do exactly what you tell them to do."

    Excellent resource for learning PHP here


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •