Firefox image scaling problem

Discussion in 'Web Design and Development' started by ghostchild, Dec 21, 2008.

  1. ghostchild macrumors 6502

    ghostchild

    Joined:
    Jun 17, 2007
    #1
    Hey all here is my page I am working on. As you can see the image won't scale, I want to scale it by height but it won't let me. Please help me. I've tried for a month already.... :( I got it to work on Safari though.

    thing is that I simply coded it here and it works both in safari and firefox, but it doesnt work with my code i have now......

    Main problem is that Firefox is ignoring and overriding my div container and allowing the image within the container to be bigger than the container itself....

    The point of this is not having to shrink all my photos.

    John
     
  2. ghostchild thread starter macrumors 6502

    ghostchild

    Joined:
    Jun 17, 2007
  3. angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #3
    I looked at it and played with some ideas, but didn't get it to quite work out. Would you be willing to use a JavaScript solution?

    Edit: OK, worked it a little more with my own stuff.

    HTML:
    HTML:
    <body>
    <div id="content">
    <img src="test-tall.jpg" alt="" />
    <!-- end content --></div>
    </body>
    
    CSS:
    Code:
    #content {
     position: absolute; top: 0; left: 0;
     height: 100%; width: 100%;
    }
    img {
     display: block;
     height: 100%; width: 100%;
    }
    The CSS here are the essential pieces.
     

Share This Page