Picture gallery alignment issues

HTML & CSS
1

on this page when you click on any of the images, the enlarged picture is off to the right with the red X in the middle. what i want to have happen is have the picture centered. and the X over top of it in the upper right area of the picture.

any idea how i go about that? please advise. thanks in advance!

2

HI,

Try something like this:


#shWrap {text-align:center;}
#imgContainer{
width:auto!important;
position:relative;
display:inline-block;
}
3

thanks. that did work.

but raised another issue. this is a responsive site. and when the browser width is shrunk to that of a phone, the pic is not quite centered even though the caption is: http://prntscr.com/3brk34

any idea how i center the picture in that instance?

4

Hi that looks a screenshot of your existing code?

When I add my fix the image is perfectly centred at 320px window width.

Have you cleared cache?

5

yes, i’ve cleared my cache. it seems that when i clear the cache and first click on a picture on that page the alignment is off, but when i click the arrows to go to another image, then navigate back, the alignment is centered.

maybe there’s some more complicated caching issue going on. we do not have any active caching plugins.

6

I’m still not seeing the code I gave you in that page?

You seem to have the rule in the css but pre-fixed width a #post26 id but there is no such id in the page.

7

oops. i had the wrong page id. its working now. thanks!