带百分比的最大宽度似乎在 IE 8 或 Firefox 3 中都不起作用。特定的像素宽度可以正常工作。我错过了什么吗？
我有一个输入表单，我想在它的右边显示一些解释性文字。但我不希望解释性文字挤压表格。
我以前没有使用过最大宽度，但它似乎是一个很好的解决方案。我写了这个简单的 CSS 样式:
div.hint {max-width: 50%; float: right;}
然后我写道:
<div class=hint>... hint text</div>
<form action=xxx method=post>
... etc ...
div.hint 将表单向左严重挤压。
我只是用一些文本而不是表格来尝试这个。 div.hint 占据了大约 95% 的屏幕，只在左侧留出一小块空白，然后其他文本被完全推到它下面。
如果我将最大宽度从百分比更改为固定像素数，它似乎可以工作。但我不想以像素为基础，因为我不知道用户浏览器的尺寸。
尽管我阅读了文档中的内容，但 percent 是否不能与 max-width 一起使用，还是我遗漏了什么？
作为对 Seanmonster 评论的回应:在这里，我将给出一个简单但完整的网页，说明我认为应该起作用但不起作用的东西:
<html><title>Max width test</title>
<style>
.form {max-width: 75%; float: left;}
.hint {max-width: 50%; float: right;}
</style>
<div class=hint>
<p>Fourscore and seven years ago our forefathers brought forth on this continent a new nation, conceived in liberty and dedicated to the proposition that
all men are created equal. We are now engaged in a great civil war, testing whether that nation, or any nation so conceived and so dedicated,
can long endure. We are met on a great battlefield of that war. We have come to dedicate a portion of that field as a final resting place
for those who here gave their lives that that nation might live. It is altogether fitting and proper that we should do this. Etc.
</div>
<div class=form>
<table>
<tr><th>Label 1 <td>Value 1
<tr><th>Label 2 <td>Value 2
<tr><th>Label 3 <td>Value 3
</table>
</div>
</html>
当我在浏览器中打开此页面时，我得到的不是两列，而是“提示”div 占据了 100% 的宽度，在其下方是“表单”div 占据了 100% 的宽度。如果我将两个最大宽度都更改为“宽度:50%”，我会得到两列，正如我所期望的那样。显然我遗漏了一些关于 max-width 应该如何工作的东西，但是......我不明白。
最佳答案
Max-width 在 FF3 和 IE8 中以百分比形式工作得很好。但是，百分比基于父宽度。周围没有 child 。
关于html - 带百分比的 CSS 最大宽度，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/1517469/