Как заставить DIV не оборачиваться? - PullRequest
Новая
       35

Как заставить DIV не оборачиваться?

156 голосов
/ 05 апреля 2009

Мне нужно создать контейнер DIV стиль, который содержит несколько других DIV. Спрашивается, что эти DIV не будут переноситься, если размер окна браузера будет изменен, чтобы быть узким.

Я пытался заставить его работать, как показано ниже. 

<style>
   .container
   {
      min-width: 3000px;
      overflow: hidden;
   }
   .slide
   {
      float: left;
   }
</style>
<div class="container">
   <div class="slide">something</div>
   <div class="slide">something</div>
   <div class="slide">something</div>
   <div class="slide">something</div>
</div>

Это работает в большинстве случаев. Однако в некоторых особых случаях рендеринг некорректен. Я обнаружил, что контейнер DIV изменился до 3000px ширины в RTL IE7; и это оказывается грязным.

Есть ли другой способ заставить контейнер DIV не оборачивать?

Ответы [ 12 ]

0 голосов
/ 13 июня 2018 
<div style="height:200px;width:200px;border:; white-space: nowrap;overflow-x: scroll;overflow-y: hidden;">
   <p>The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.The quick brown fox jumps over the lazy dog.The quick brown fox jumps over the lazy dog.
   The quick brown fox jumps over the lazy dog.The quick brown fox jumps over the lazy dog.The quick brown fox jumps over the lazy dog.The quick brown fox jumps over the lazy dog.
   The quick brown fox jumps over the lazy dog.
   The quick brown fox jumps over the lazy dog.The quick brown fox jumps over the lazy dog.The quick brown fox jumps over the lazy dog.The quick brown fox jumps over the lazy dog.
   The quick brown fox jumps over the lazy dog.The quick brown fox jumps over the lazy dog.</p>
</div>
0 голосов
/ 27 апреля 2015

Тег <span> используется для группировки встроенных элементов в документе.
(источник)

Страница:
...