我有一个输入表单,我想在其右侧显示一些解释性文本.但我不希望解释性文本压缩表格.
我之前没有使用过max-wIDth,但它似乎是一个很好的解决方案.我写了这个简单的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％,只是左边有一个小的边距,然后另一个文本被完全推到它下面.
如果我将最大宽度从百分比更改为固定数量的像素,它似乎工作.但我不想以像素为基础,因为我不知道用户浏览器的尺寸.
尽管我在文档中读到了,或者我遗漏了什么东西,百分比是否与最大宽度无关？
回应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 thatall 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 placefor 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％,而在“form”div占用100％的宽度之下.如果我将最大宽度更改为“宽度：50％”,我会得到两列,如我所料.显然我错过了一些关于max-wIDth应该如何工作的东西,但是……我不明白.
解决方法 在多种情况下,ie8上的max-wIDth是错误的.这是一个众所周知的问题.你可以在这里找到一篇文章. http://edskes.net/ie8overflowandexpandingboxbugs.htm
你需要三件事来触发这个BUG – maxwIDth,scrollbars和float
总结以上是内存溢出为你收集整理的html – CSS max-width with percent全部内容，希望文章能够帮你解决html – CSS max-width with percent所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）