Html 表格输入赢得'；不要用百分比填充
如果使用了像素填充，我的表单输入将正确显示，但使用左、右填充百分比会破坏它。我不明白为什么 它在Safari中工作，在Firefox 3.5.3 OSX中中断 问题是，当我使用百分比填充时，填充全部中断（因此输入值没有很好地对齐）Html 表格输入赢得'；不要用百分比填充,html,css,css-selectors,Html,Css,Css Selectors,如果使用了像素填充，我的表单输入将正确显示，但使用左、右填充百分比会破坏它。我不明白为什么 它在Safari中工作，在Firefox 3.5.3 OSX中中断 问题是，当我使用百分比填充时，填充全部中断（因此输入值没有很好地对齐） %填充物 html，body，div，dl，dt，dd，ul，ol，li，h1，h2，h3，h4，h5，h6，pre，form，fieldset，input，textarea，p，blockquote，th，td{ 保证金：0； 填充：0； 边界：无； } 部门内容
%填充物
html，body，div，dl，dt，dd，ul，ol，li，h1，h2，h3，h4，h5，h6，pre，form，fieldset，input，textarea，p，blockquote，th，td{
保证金：0；
填充：0；
边界：无；
}
部门内容{
宽度：50%；
保证金：0自动；
背景：#eee；
}
分区内容表格{
宽度：100%；
}
部门内容表{
列表样式：无；
保证金：0；
宽度：100%；
}
部门内容表格李{
位置：相对位置；
边缘底部：20px；
高度：64px；
宽度：100%；/*已声明宽度*/
}
div.content表单li标签{
位置：绝对位置；
宽度：自动；
左：0；
排名：0；
线高：20px；
}
div.content表单li.text{
位置：绝对位置；
底部：0；
左：0；
填充：10px 2%；/*如果将2%更改为2px，填充工作正常*/
宽度：96%；
字体大小：14px；
外形：1px实心#ccc；
}
-
输入
-
输入
-
输入
%填充物
html，body，div，dl，dt，dd，ul，ol，li，h1，h2，h3，h4，h5，h6，pre，form，fieldset，input，textarea，p，blockquote，th，td{
保证金：0；
填充：0；
边界：无；
}
部门内容{
宽度：50%；
保证金：0自动；
背景：#eee；
}
分区内容表格{
宽度：100%；
}
部门内容表{
列表样式：无；
保证金：0；
宽度：100%；
}
部门内容表格李{
位置：相对位置；
边缘底部：20px；
高度：64px；
宽度：100%；/*已声明宽度*/
}
div.content表单li标签{
位置：绝对位置；
宽度：自动；
左：0；
排名：0；
线高：20px；
}
div.content表单li.text{
位置：绝对位置；
底部：0；
左：0；
填充：10px 2%；/*如果将2%更改为2px，填充工作正常*/
宽度：96%；
字体大小：14px；
外形：1px实心#ccc；
}
div.content表单li.textbox{
位置：绝对位置；
底部：0；
左：0；
填充：10px 2%；/*如果将2%更改为2px，填充工作正常*/
宽度：96%；
字体大小：14px；
外形：1px实心#ccc；
边框：1px实心#ccc；
背景色：白色；
}
.文本框{
宽度：100%；
边框：纯色1px白色；
}
-
输入
-
输入
-
输入
这个错误终于被修复了！2012-11-18 15:35太平洋标准时间哦，这是一个处理html格式问题的好地方，因为它是专门为此设计的。不幸的是，doctype的设计太差，我无法处理。它似乎不是“专门设计的”，只是无缘无故的不同。Dah，这需要修复：（.希望人们投票支持这个问题。确保也支持阻止它的错误。哇，已经快3年了，错误仍然存在。希望它最终会得到修复。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>% padding</title>
<style>
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
margin:0;
padding:0;
border:none;
}
div.content {
width:50%;
margin:0 auto;
background:#eee;
}
div.content form {
width:100%;
}
div.content form ul {
list-style:none;
margin:0;
width:100%;
}
div.content form li {
position:relative;
margin-bottom:20px;
height:64px;
width:100%; /* width is declared */
}
div.content form li label {
position:absolute;
width:auto;
left:0;
top:0;
line-height:20px;
}
div.content form li .text {
position:absolute;
bottom:0;
left:0;
padding:10px 2%; /* if 2% is changed to 2px the padding works correctly */
width:96%;
font-size:14px;
outline:1px solid #ccc;
}
</style>
</head>
<body>
<div class="content">
<form action="" method="get">
<ul>
<li>
<label for="text">Input</label>
<input type="text" class="text" name="text" value="" />
</li>
<li>
<label for="text">Input</label>
<input type="text" class="text" name="text" value="" />
</li>
<li>
<label for="text">Input</label>
<input type="text" class="text" name="text" value="" />
</li>
</ul>
</form>
</div>
</body>
</form>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>% padding</title>
<style>
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
margin:0;
padding:0;
border:none;
}
div.content {
width:50%;
margin:0 auto;
background:#eee;
}
div.content form {
width:100%;
}
div.content form ul {
list-style:none;
margin:0;
width:100%;
}
div.content form li {
position:relative;
margin-bottom:20px;
height:64px;
width:100%; /* width is declared */
}
div.content form li label {
position:absolute;
width:auto;
left:0;
top:0;
line-height:20px;
}
div.content form li .text {
position:absolute;
bottom:0;
left:0;
padding:10px 2%; /* if 2% is changed to 2px the padding works correctly */
width:96%;
font-size:14px;
outline:1px solid #ccc;
}
div.content form li .textbox {
position:absolute;
bottom:0;
left:0;
padding:10px 2%; /* if 2% is changed to 2px the padding works correctly */
width:96%;
font-size:14px;
outline:1px solid #ccc;
border:1px solid #ccc;
background-color:white;
}
.textbox {
width:100%;
border:solid 1px white;
}
</style>
</head>
<body>
<div class="content">
<form action="" method="get">
<ul>
<li>
<label for="text">Input</label>
<div class='text'>
<input type="text" class="textbox" name="text" value="" />
</div>
</li>
<li>
<label for="text">Input</label>
<div class='text'>
<input type="text" class="textbox" name="text" value="" />
</div>
</li>
<li>
<label for="text">Input</label>
<div class='text'>
<input type="text" class="textbox" name="text" value="" />
</div>
</li>
</ul>
</form>
</div>
</body>