Twitter Bootstrap Responsive Background-Image inside Div

Question

How i can modify #bg image so it would be responsive, resizable and proportional in all browser?

HTML:

Answer 1

I had the similar issue and i solved it using:

background:url(images/banner1.png) no-repeat center top scroll;
background-size: 100% auto;
padding-bottom: 50%;

... here i had to add the padding: 50% because it wasn't working for me otherwise. It allowed me to set the height of container, as per the size ratio of my banner image. and it is also responsive in my case.