Home/ Questions/Q 9139963
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-17T09:27:16+00:00

I’ve created a JSFiddle here: http://jsfiddle.net/AsHW6/ What I’m attempting to do is get the

  • 0

I’ve created a JSFiddle here:
http://jsfiddle.net/AsHW6/

What I’m attempting to do is get the down_arrow.png’s centered in their containing divs. I was able to center the up_arrow.png’s using auto margins. I’m using the fixed property to use them as footers, as I want them to be at the bottom of the div regardless of resolution.

My question is what is the best way to center a bottom fixed image within the width of its containing div?

Some code from the fiddle (I’m having trouble with the StackOverflow formatting): 

    .scroll-arrow-down {
        position: fixed;
        bottom:0;
    }

I should add that I don’t care about IE hacks/workarounds at all, this application will not be targeting IE in any way.
Any comments and answers are appreciated.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If you used fixed position it will be fixed to the viewport (which I don’t think you want). Using absolute positioning will position the images in reference to the item that contains them.

    I added a left:45%; which pretty much centers things, but depending on the width of your arrows that may need to be updated. 

    .scroll-arrow-down {
    position: absolute;
    bottom:0;
    left: 45%;
}

    http://jsfiddle.net/AsHW6/1/

    • 0