Плавающие элементы в горизонтальной прокрутке контейнера

Question

Как я могу предотвратить перенос этих элементов в окне браузера, не устанавливая фиксированную ширину контейнера?

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

<style>

#container {
  height: 300px;
}

#container > div {
  width: 300px;
  height: 300px;
  float: left;
}

</style>

Answer 1

Если вы хотите прокрутить по горизонтали, вам нужно указать overflow-x: auto.Я выложу пример как можно скорее.