Скрыть горизонтальную полосу прокрутки, вызванную определенным div

Question

У меня есть следующий HTML:

<div id="container">
   <div id="content"></div>
</div>

Контейнер div имеет ширину 1050 пикселей и включает в себя только теневой фон, который повторяется по вертикали.

Div содержимого имеет ширину 950 пикселей, расположен в середине контейнера div (горизонтальный) и включает содержимое.

Что мне нужно - горизонтальная полоса прокрутки появляется только в том случае, если окно браузера меньше, чем div содержимого, но контейнерный div не должен вызывать появление полосы прокрутки. Как я могу это сделать?

overflow-x: скрытый не работает.

Thx

http://jsfiddle.net/98Eqf/1/

Answer 1

Я бы предложил использовать медиазапрос, чтобы проверить, имеет ли браузер ширину 950 пикселей, а затем отобразить полосу прокрутки.Это позволит вам использовать overflow-x:hidden;, пока оно больше, а затем, когда оно станет меньше, вы можете просто сделать overflow-x:scroll; и сделать панель отображаемой.

Answer 2

http://jsfiddle.net/hobobne/98Eqf/2/