Your gallery (the 'juicebox-container' <div>) is horizontally centered within its parent container and, within the gallery, the thumbnails are centered within the thumbnail area and the main image is centered within the image area.
This I do not understand. If the <div>, which I assume means the entire gallery, is centered, and then each element is centered within its own area, why does the Main Image have a greater amount of blank space on its left side than its right, if the edge of the thumbnail is assumed to be the edge of the thumbnail container? Why is the Button Bar not centered? Why would the thumbnails be flush to the edge of the container, if the entire gallery is centered within the container?
As far as I'm concerned, if the entire gallery were centered, it would look something like this: http://www.graphitegolem.com/blog/wp-co … ntered.jpg
This is because you have set thumbsPosition="LEFT" and thumbNavPosition="BOTTOM".
I want the thumbnails to the left of the image. That, in fact, was the majority of the reason I bought Pro, as Lite only allows you to have them below. I did not realize that I wouldn't have any control over the gallery layout past putting them on the left side, though.
Try resizing your gallery browser (by reducing its width) and you will see that the thumbnails and main images become closer together.
For me, this isn't really an acceptable solution, as it's not giving me the layout I want when I bring the gallery up in what I consider a normal browser layout. Maybe this works better for mobile; I don't know, I'm not a web expert here.
Currently, there is no configuration option available to horizontally align the main images to the right edge of the image area. However, in a browser window of a certain aspect ratio (closer to portrait than landscape), the right side of your main images will be flush against the right edge of the gallery. Try resizing your browser window and you should see this.
I don't want the main image aligned right.
I want it, along with the thumbnails, nicely aligned center. Since everything is centered in my Wordpress site, it looks off-center with the thumbnails flush to the left and the main image (apparently) floating in no particular place.
thumbsPosition="LEFT" - I had this already.
maxThumbRows="3" - I had this already.
maxThumbColumns="3" - I had this already.
thumbNavPosition="BOTTOM" - I had this already.
thumbPadding="0" -Doesn't provide any real appreciable effect, aside from making the thumbnails closer together.
imagePadding="0" - I had this already.
imageScaleMode="FILL" - This balloons the image to the point where I can't see all of it, no matter what I seem to do to my browser's proportions. I'm not sure why this is even an option. ScaleMode = "SCALE" seems to keep it within the bounds of the container, though again, it's not really centered, and I'm kind of disappointed with this so far.