CSS height when using background-size

[mrcancel]

So I wanted to resize the background image of a \[code\]div\[/code\] using \[code\]background-size: contain\[/code\], and I set the \[code\]width\[/code\] to 100%. I need this for a mobile site, where the dimension of the screen is variable. However, i have a dilemma when setting the height. If I set the height in pixels, when the picture becomes smaller, it leaves an empty space below the picture.If I don't set the height, the picture won't appear at all.What's the best solution to this?Here's my code:\[code\]<div id="container"> <p>Some text</p> <div id="my-picture"></div></div>\[/code\]CSS:\[code\]#container { width: 100%;}#my-picture { background:url(somepic.jpg) no-repeat; background-size: contain; height: ???}\[/code\]