Q:

Div height to image height and image width to div width

I have a div I use as a container and an image I use as a "background" (not literally, I was told I couldn't do this with background attribute) and then a content div:
CSS
#container {
  display:table;
  width: 100%;
  min-width:100%;
}

.img1 {
  //DON'T KNOW WHAT TO PUT HERE;
}

#content {
  //not important;
}

HTML
<div id="container">
    <img class="img1" src="img.png"/>
    <div id="content"> Content </div>
</div>

I need the container div to be 100% screen width, and so the contained image, while both of them must have the image's resulting height (after the resizing from taking 100% screen width) (no stretching).
Any way to do that? I tried a lot of min-height and width combination but nothing worked so far.
I prefer CSS and HTML only solutions, if possible.

A:

Not exactly sure what you mean, but how does this look: https://jsfiddle.net/b76fjtcv/
basically it's 
.img1 {width: 100%;}

This updated version of the fiddle also adds a max width to the img so it doesn't get too fuzzy. Just set the max-width of the .img1 to the image's full width. 

