I'm working with a very unforgiving CMS, and people who have no concept of valid HTML entering content into said CMS. So I apologize for presenting invalid code.

I'm trying to find a way to align images of varying widths and their captions to left, right or center. The way our CMS is set up I can't use any sort of server side solution to store/determine file size.

As you can see I have set a static width to the containing div (BNP-IMAGE), this is not an ideal solution as we would like to be able to use larger images in some cases.

I'm thinking it should be able to be done with JS, but I'm not sure exactly how.

  • Should we be looking at a link or screen shot? Efficient Pixel about 10 years ago
  • I'm sorry, here's the link. http://www.casinojournal.com/Articles/Article_Rotation/BNP_GUID_9-5-2006_A_10000000000000584079 James White about 10 years ago

2 answers

This was chosen as the best answer

This is just thinking aloud, but couldn't you set min-width on the div (and use an expression for IE (http://www.gunlaug.no/contents/wd_additions_14.html) ) and some margin on the image. You could also set max-width and use overflow:hidden to trap any ridiculously large images.

That way the width of the div, which sets the width of the caption would grow to accommodate larger images.

if you had more control over the html, I'd suggest sticking with the fixed width container and inline-styling the image as a background, which allows you to crop larger images with css.

Answered about 10 years ago by Tony Crockford

With min-width the div flows to the length of the caption text.

Answered about 10 years ago by James White
  • could you put a max-width on the caption p element? and jiggle the numbers to get something appropriate. which CMS is it? Tony Crockford about 10 years ago
  • it's a custom cms. while it's not a perfect solution I like your idea better than what I'm doing now. Our programming group is looking at a way of storing the image sizes in the DB which would completely fix the problem. James White about 10 years ago