Question

I am trying to get wrap my head around this and I’m not gaining much ground. I have a background image that is auto scaling to whatever the window size is. In front of it I am trying to center an image that is fixed to the bottom of the page all the while being scalable. This is the CSS that I have right now.

        #guys img{
            width:35%;
            margin-left:auto;
            margin-right:auto;
            bottom:0px;
            position: fixed;
        }   

and this is how i am calling said DIV

    <div id="guys">
        <img src="img/boys.png" alt="">
    </div>

What I end up with is the image fixed to the bottom of the page, and is scalable, but never have I been able to end up with it centered as well. Any thoughts? i would be so grateful!

Answer 1

As I can see your Image is already in a Div
make that div relative and margin auto with same width as your Image and everything should work just fine.

        #guys{
        position:relative;
        margin:auto;
        width:35%;

    }       
       #guys img{
        width:35%;
        bottom:0px;
        position: fixed;

    }