0

In this example Only Internet Explorer 9 or 10: http://jsfiddle.net/QQxgg/ if I put a width of main fieldset, for example 655px, the label of text is larger than normal.

In Firefox and Chrome, the label size is auto-width, so behavior is OK. Is possible, to specify a width of fieldset and label auto-width in Internet Explorer? Thanks.

ie9,10

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style>
fieldset {
width: 655px;
}

fieldset {
    display: table;
}
fieldset p {
    display: table-row;
}
fieldset input, 
fieldset select, 
fieldset label {
    display: table-cell;
    margin: 3px;    
}
fieldset label {
    text-align: right;
}

</style>
</head>
<body>

<fieldset>          
<p><label>First Name: </label><input type="text" /></p>
<p><label>Second Name: </label><input type="text" /></p>
<p><label>Country: </label><select><option>Choose</option></select></p>
<p><label>Age: </label><select><option>Choose</option></select></p>
</fieldset> 

</body>
</html>
4

2 に答える 2

0

このようなものが欲しいですか？

つまり、フィールド セットのイメージ

ここにコードがあります、

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style>
fieldset {
width: 500px;
}
fieldset {
    display: inline-block;
}
fieldset input, 
fieldset select, 
fieldset label {
    display: table-cell;
    margin: 3px;    
}
fieldset label {
    text-align: right;
}
</style>
</head>
<body>
<fieldset>          
<label>First Name: </label><input type="text" /><br>
<label>Second Name: </label><input type="text" /><br>
<label>Country: </label><select><option>Choose</option></select><br>
<label>Age: </label><select><option>Choose</option></select>
</fieldset> 
</body>
</html>
于 2012-12-11T09:24:28.163 に答える