SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast
    Join Date
    Dec 2011
    Posts
    99
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    trouble stacking two images

    I'm trying to stack two images on top of each other inside of a div. It is working on everything (even ie) except for firefox on windows (works on firefox mac). On firefox windows it is getting positioned right next to the image instead of over it. The image on top is a overlay in the corner (for those of you looking at the link). I was hoping someone might be able to help me find what is wrong.

    here is the site: http://aaronhaas.com/pitchshark7/profile.php?user_id=5

    CSS
    Code:
    #profile_pic{
    	
    	position:relative;
    	float:left;
    	width:225px;
    	height:300px;
    }
    
    #userpic{
    	
    	float:left;
    	width:225px;
    	height:300px;
    	z-index: 1;	
    }
    
    #profile_overlay {
    	
    	position:absolute;
    	width:225px;
    	height:300px;
    	z-index: 200;
    }
    HTML
    Code:
    <div id='profile_pic'>	
            <img id='profile_overlay' src='img/users/pic_overlay3.png' >
    	<img id='userpic' src='img/users/pperrette_225x300.png'></img>
    </div> <!-- close profile pic -->

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    23,588
    Mentioned
    411 Post(s)
    Tagged
    6 Thread(s)
    It's not working of FF Mac either. Try removing the float from #userpic . Also, the z-index won't do anything, as it only works on positioned elements.

    Code:
    #userpic {
      height: 300px;
      width: 225px;
    }

  3. #3
    SitePoint Enthusiast
    Join Date
    Dec 2011
    Posts
    99
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    that fixed it thanks. I thought I had tried that but I must not have.


Bookmarks

Posting Permissions

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