我在我的主页上使用这个CSS代码几个div框:

#homepagebox {
    width:80%;
    margin:0 auto 0 auto;
}
#homepagebox .column {
    float: left;
    width: 25%;
}
#homepagebox .column div {
    margin: 15px;
    min-height: 300px;
    max-height:300px;
    color:#ffffff;
    background: #666666;
    border-radius:10px;
}

当屏幕变得太小时,我需要它们开始在彼此之下显示,但显然如果屏幕足够大,那么所有屏幕都显示在彼此旁边。

此刻,如果屏幕太小,盒子就会变小

这是一个小提琴: http//jsfiddle.net/LEvzs/

===============>>#1 票数:2 已采纳

#homepagebox .column {
    float: left;
    min-width: 25%;
}

如果以百分比形式设置宽度,则永远不会达到需要将内容包装到下一行的程度。 将其设置为最小宽度可确保它们永远不会收缩到该点以下,因此会换行。

[edit]更新小提琴有一个固定的宽度,但仍然需要时换行。

#homepagebox .column {
    float: left;
    width: 25%;
    min-width: 200px;
}

http://jsfiddle.net/LEvzs/2/

  ask by translate from so

未解决问题?本站智能推荐:

2回复

CSS不会在DIV中对齐文本

我是学习jquery并创建自己的网站的新手。 这是我的小提琴JSFIDDLE 。 当您将鼠标悬停在新的div上时会显示一些文字。 但是文本不在该div中。 我想要新div中的文字。 我不知道为什么会这样。 我知道这是一个愚蠢的问题,但是我花了一个多小时才把它弄对了。 编码
5回复

CSS类不会在div中隐藏内容

我写了这个CSS代码: 和HTML: 但是它不想隐藏。 谢谢
2回复

Div元素不会在css中转到新行

ID =内容的Div标签不会换行。 它会像这样进入标题行。 任何人都可以解释为什么会发生这种情况? ,以及如何把它放在新的一行?
2回复

CSS按钮将不会在div的中心对齐

我的网站上有一个展示区div ,在div我有一个“开始使用” button 。 我能够使button与margin属性垂直对齐。 但是我不想水平地将button与margin对齐,因为这将来会给我带来麻烦,我已经尝试过align: center; 和align="center"但该button粘贴在
2回复

CSS如何继续文字而不会在

我只是想知道我应该如何添加到div样式中,使文本以“ ...”继续,而不是像这样换行: 我的代码在下面,我希望我的porfolio-info div使用这种样式: 谢谢
9回复

为什么这个css按钮不会在div里面?

所以......这开始让我恼火......我想我会来这里得到一些帮助.. 盒子周围的主要div有一个宽度...然后有文本......和我想要的按钮在div的中心.. 它是一个<a href>按钮..但它不会居中。 我不认为我需要指定宽度,因为外部div有宽度..我试
1回复

悬停不会在CSS的DIV上显示

我正在制定广播时间表,而我的问题是使css中的悬停功能能够正常工作。 这是完整的代码: http://pastebin.com/hyBtmVpE 困难领域与我的代码的这一部分有关: 我想做的是让带有CSS类epg-item_media,media_img,media_b
1回复

DIV CSS背景图像不会在IE 8中显示

我们的Intranet网站是在兼容模式下查看的(即8),并且CSS图像背景没有显示。 CSS的任何调整,以适应即8期。 (html,css在chrome中有效,并且在ie-9及更高版本中有效)。 js小提琴在这里jsfiddle.net/729xwamv/
2回复

jQuery / CSS菜单不会在iPad上的固定div上浮动

我一直在一个网站上工作,该网站的顶部固定有一个固定的div,下面有一个固定的下拉菜单。 如果将鼠标悬停在IE或FF中的“住宿地点”上,则可以完美运行,但在ipad上查看时,菜单子项会显示在固定的div下方。 我已经尝试过各种z-index,但是我无法使其在ipad上正常运行。 谁能帮我
4回复

空Div不会在IE6中注册CSS事件

我有两个具有相同事件onmousedown的元素。 元素还具有以CSS样式设置的Cursor:move属性。 元素为空,除了边框以外,必须为空或至少透明。 在IE 6中,只有边界会记录光标更改或激活javascript事件处理程序。 IE6将空div视为不存在。 如果将鼠标悬停或单