I've got an image on the page (class='image') within the div (class='galleria_wrapper') and want to place a caption (class='caption') at the lower right corner under that image.

The image could be vertical or horizontal, and making a fixed padding-right value let's say

.caption<{float:right;padding-top:5px;padding-right:90px;} 

is not working for one or another. I need to switch on the fly padding-right value depending on horizontal or vertical image is currently on the page. I can theoretically access image's width through document.getElementByName('image').width although don't understand where to put that code. So, I probably need something like that:

document.getElementByClass('caption').padding-right = 
    (document.getElementByName('galleria_wrapper').width - 
    document.getElementByName('image').width)/2

Where do I put this code?

I do have that in my css file:

.caption{float:right;padding-top:5px;}

which places the caption below the image, but to far to the right (div 'galleria_wrapper' is wider than most of the images supposed to be displayed within that area).

I have an img tag in the html:

<img src=image title='this is caption' /></li>

...and some JavaScript which makes title displayed styled by the "caption" css definition.

How do I assign variable value for the padding-right without in-advance knowledge of particular image's width?