Question

Hi I have a comment posting function where public user can link and display images using

Something like [img]http://www.google.com/img.png[/img]

Issue is that user may link to an image that is of extremely large height and width which is more than the height and width of the div it is in causing some overflow layout issues

Is there anyway I can resize the image such that it still fit in the div without losing the aspect ratio?

Alternatively can I use CSS something like set overflow to display scroll bar if that happens?

Answer 1

You should be able to apply max-width and max-height to the img via CSS.

#my_selector img
{
    max-width: 200px;
    max-height: 200px;
}