Making a div the same size as an image inside it

Question

I have an div with the following code

HTML:

<div id='imgContainer'>
    <img src='/img/logo.png' id='imglogo'></img>
</div>

CSS

div#imgContainer {
    width: 250px;
    height: 250px;
    padding: 13px;
}

The problem is the users can edit the image size, colour and some other things, so I want the div to get bigger as the image get bigger. I want the width and height of the div to be 250px if the image is smaller than it, but to get bigger as the image gets bigger.

The solution can be in PHP, JavaScript, CSS or jQuery.

Answer 1

Try this:

div#imgContainer {
    min-width: 250px;
    min-height: 250px;
    padding: 13px;
    display: inline-block;
}

Fiddle

Thanks to @ahren and @Mohsen