如何使一个DIV不包？ [英] How to make a DIV not wrap?

问题描述

我需要创建一个包含多个其他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在IE7的RTL中改变为3000px宽度;

有没有其他方法使容器DIV不能换行？ >解决方案

尝试在容器样式中使用 white-space：nowrap; （而不是 overflow：hidden; / code>）

I need to create a container DIV style that contains multiple other DIV's. It is asked that these DIV's wouldn't wrap if the browser window is resized to be narrow.

I tried to make it work like below.

<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>

This works in most cases. However, in some special cases, the rendering is incorrect. I found the container DIV change to 3000px width in RTL of IE7; and it turns to be messy.

Is there any other way to make a container DIV not to wrap?

解决方案

Try using white-space: nowrap; in the container style (instead of overflow: hidden;)

这篇关于如何使一个DIV不包？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！