我想在同一行有两个项目,左边的项目用float: left表示.

我一个人完成这件事没有问题.问题是,我希望同一行even when you resize the browser very small上的两个项目为stay.你知道的...就像桌子一样.

目标是防止右边的物品包裹no matter what个.

我如何告诉使用CSS的浏览器,我宁愿stretch the containing 100而不是包装它,使float: right; div低于float: left; div

我想要的是:

                                   \
 +---------------+  +------------------------/
 | float: left;  |  | float: right;          \
 |               |  |                        /
 |               |  |content stretching      \   Screen Edge
 |               |  |the div off the screen  /  <---
 +---------------+  +------------------------\
                                             /

推荐答案

将您的浮动<div>包装在一个容器<div>中,容器<div>使用以下交叉浏览器最小宽度攻击:

.minwidth { min-width:100px; width: auto !important; width: 100px; }

您的may也需要设置"溢出",但很可能不需要.

这之所以有效,是因为:

  • !important声明与min-width结合使用会使IE7+中的所有内容保持在同一行上
  • IE6不实现min-width,但它有一个缺陷,即width: 100px覆盖!important声明,导致容器宽度为min-widthpx.

Css相关问答推荐

Chrome/MacOS和Firefox/MacOS能够使用两种字体的字形渲染字符串,但Chrome/iOS和Safari/Any不能

MUI Textfield-悬停时输入标签 colored颜色

媒体查询在生产中没有响应:React 18 应用程序

这个 CSS :is() Select 器没有像我想象的那样工作

使用 CSS 关键帧动画更改内容

有人可以解释为什么我的 CSS 转换如此突然吗?

带有 flex 的 CSS 空 div 以扩展并保持纵横比

更改 20 个实例中的一个组件的样式

TypeScript 中有效的 CSS 属性名称数组,但带有连字符

用于替代渲染的 CSS 嵌套

如何使用 TailwindCSS 水平设置输入和按钮

循环一个 sass/scss 变量以生成 css 变量

CSS动画恢复默认

Div Size 自动调整内容大小

如何在没有填充区域的情况下背景化 div

什么是 ::content/::slotted 伪元素,它是如何工作的?

如何保持标题静态,滚动时始终位于顶部?

CSS Select /样式第一个词

thead 和 tbody 之间的间距

在 Twitter Bootstrap 中创建圆角的正确方法