问题标签 [css-float]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
1640 浏览

html - 强制所有浮动 DIV 匹配其容器的高度

我试图找出一种方法使三个浮动 div 与三个浮动 div 中最大的浮动 div 的高度相匹配(通过 clearfix 解决方案,它是它们容器的高度)。

我的问题与这个问题完全一样,只有我的问题需要对答案的评论忽略:)(“如果两列有不同的背景颜色怎么办?”等)

所以真的不能假装。该页面使用类似于 iGoogle 使用 scriptaculous 的拖放机制,拖放可排序容器是浮动 div。如果我可以强制所有容器的高度相同,那么对用户来说事情会容易得多。

我越是寻找解决方案,越是看起来用纯 CSS 做不到。如果是这种情况,我需要使用一些 javascript,就这样吧。

提前致谢。

编辑: idrumgood 的链接是一个解决方案,但不是我最终使用的解决方案。我最终将他建议的 jQuery 函数移植到原型中,以避免冲突并避免为一个函数加载整个 jquery 库。

这是我最终使用的 javascript 函数端口:

0 投票
5 回答
712 浏览

html - div 中的两列 - 使用哪一列 1) 与边距一起浮动或 2) 两个浮动

我在一个容器中有两个 div。一个是左栏,另一个是右栏。我需要一些建议/建议来使用哪种方法。

方法一:

方法二:

请建议哪一个是好的做法。

0 投票
4 回答
135 浏览

html - xhtml css 浮动等帮助

我真的在考虑回到桌子上,因为这只是#¤€&/@£总是一些东西....

这给出了:http: //i29.tinypic.com/2iawh83.png

第一个 div 中有一个巨大的空间。为什么?如果由于某种原因有超过 10 条评论,它不会

忽略愚蠢的评论

0 投票
9 回答
26469 浏览

css - 减少Firefox缩放时如何防止浮动布局换行

给定以下 HTML。它显示两列:#left, #right。两者都是固定宽度并具有 1px 边框。宽度和边框等于上容器的大小:#wrap.

当我按 Ctrl+- 缩小 Firefox 3.5.2 时,列会被包装(演示)。

如何防止这种情况?

0 投票
6 回答
8319 浏览

css - CSS Float 边框重叠问题

我试图将一个菜单浮动到页面的左侧,当它变得足够大以到达下面的内容时,Firefox 会完全按照它应该的方式将内容撞到......除了边框。

这是一个包含一些项目的屏幕截图:

http://i.stack.imgur.com/o56aZ.png

另一个有几个项目

http://i.stack.imgur.com/J7MGB.png

“方框 4”按预期移动,但其边界仍位于左侧。哦

HTML:

p>

CSS:

0 投票
3 回答
4293 浏览

css - FF3.5 与 FF3.0 的 td 内 span 的不同 css 渲染

我有一个网页,其中有一个表格,其中一个 td 是 span,它使用较小的字体,向右浮动以将其放置在最右侧,以及负边距顶部,因此它与 td 中的较大文本对齐.

使用 Firefox 3.0 它可以正常工作,但我刚刚更新到 Firefox 3.5,并且边距将文本向上移动得太远。

我有另一个页面,其中有两个跨度条目,第二个具有较小的字体和负边距并显示相同的问题。

在第三页上,h3 后跟 span,较小的字体和负边距,它在 Firefox 3.5 中运行良好。

我今天安装了 Safari,它的行为与 Firefox 3.5 相同。我对 IE 没有意见,因为我有条件 CSS 来处理不同的 IE 版本(IE 7 使用负边距,但 IE 8 使用小的正边距)。

问题(最后:^):

  • 有人知道 Firefox 3.5 的跨度和负边距渲染的变化吗?

  • 我还能如何编写 HTML 或 CSS,以获得相同的结果而无需浏览器特定的黑客攻击?

对于第二种情况,我将它从两个跨度更改为一个 h3 和跨度,就像第三种情况一样。第一种情况确实是表格数据,所以我使用的是表格。这是问题的一部分:

相关的(我希望)CSS是:

提前致谢!PCM

0 投票
3 回答
1067 浏览

html - 奇怪的(?)歌剧浮动

我在歌剧上有一些奇怪的浮动行为(IE f 完全不同,但那是以后再说)。我将 i 图标浮动到右侧。它在 Fx 和 WebKit 上运行良好,但 Opera 将图标向下移动了一点。有人知道这是怎么发生的吗?

CSS:

HTML:

火狐

Webkit http://img197.imageshack.us/img197/3269/webkit.jpg

歌剧 http://img41.imageshack.us/img41/112/operaf.jpg

0 投票
2 回答
2305 浏览

css - 将 div 浮动到 div 旁边

http://dev.dealercontrol.net/dealercontrol/index_comp1.html

在此页面上,我试图在字幕左侧浮动一个标志

我似乎无法正确布局标志,最好的方法是什么?另外,如何设置标志的高度以紧紧包裹在其中的文本上?

0 投票
5 回答
10980 浏览

css - CSS 容器 DIv 高度。浮动 DIV 问题

你能强制一个容器 DIV 高度来容纳两个浮动的 div 孩子吗?我可以用什么花哨的技巧来做到这一点?我正在尝试在父 div 中制作两个大小相同的 div。我希望它们并排出现,它们之间有一点空白。Child2 倾向于弹出并低于 Child1。注意 Child2 包含一个表。我应该漂浮吗?

HTML:

CSS:

0 投票
4 回答
34869 浏览

css - 使用百分比宽度进行布局时如何修复 Internet Explorer 7 错误?

请帮助我。我需要使用百分比宽度创建布局。我有一个 100% 宽度的包装纸。

现在我有一个 DIV(主包装器..我想保持 94% 的宽度百分比.. 94% 的 100% 身体).. 好的

所以让这个简单。

-> BODY 100% 宽度设置

--> 容器 94% 宽度

---> FIRST CHILD DIV 70% 向左浮动(容器的 70%)

---> SECOND CHILD DIV 30% 向右浮动(容器的 30%)

但我在 FIRST CHILD DIV 下有 2 个相等的列

-----> 50% 和 50% 百分比宽度

错误是:在 ie7 中..最后一列显示在底部..它没有正确浮动..如果我将宽度减小到 29.9% !!! 它有效..我认为ie7在处理百分比宽度或其他方面存在错误..请澄清这一点。我希望您能解决问题,因为 css / html 太长了.. 我只是希望这是一个常见问题.. :(

这是这个 DIV 的 CSS .. 希望有帮助:)