HTML: Проблема с гнездом DIVs

Я кодирую генератор формы. До сих пор, так хорошо, тогда я решил дать ему настоящий тест.HTML: Проблема с гнездом DIVs

Я сделал форму с некоторыми гнездами, каждая из которых держала несколько элементов управления.

Я выложу HTML в конце. Если вы загружаете его в браузер, он отображает, но явно ошибочен.

Я ранее тестировал с помощью валидатора W3C, и все было хорошо, но это было для не вложенных. Когда я проверяю форму с вложенными ошибками, я получаю ошибки:

Error Line 13, Column 117: document type does not allow element "DIV" here 

…style="position: absolute; top:88px; left: 256px; width: 145px; height: 21px;">

Итак, как это исправить? Что мне делать с вложенными FIELDSET?

Вот полный HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<title></title> 
<meta http-equiv="Content-type" content="text/html;charset=UTF-8"> 
</head> 
<body> 
<form action="C:\temp\an_elogger_test.php" method="get"><div class="TGroupBox" id="GroupBox1"> 
<fieldset style="position: absolute; top:24px; left:24px; width: 449px; height: 473px;"> 
<legend>GroupBox1</legend> 
<div class="TPanel" id="Panel1"> 
<fieldset style="position: absolute; top:64px; left:64px; width: 361px; height: 217px;"> 
<legend></legend> 
<div class="TComboBox" id="ComboBox1" style="position: absolute; top:88px; left: 256px; width: 145px; height: 21px;"> 
    <select name="ComboBox1"> 
    <option value="- one -" selected="selected">- one -</option> 
    <option value="- two -">- two -</option> 
    <option value="- three -">- three -</option> 
</select> 
</div> 
<div class="TGroupBox" id="GroupBox2"> 
<fieldset style="position: absolute; top:80px; left:88px; width: 145px; height: 177px;"> 
<legend>GroupBox2</legend> 
<div class="TCheckBox" id="CheckBox1" style="position: absolute; top:112px; left: 104px; width: 97px; height: 17px;">CheckBox1<input type="checkbox" name="CheckBox1" value="CheckBox1Checked"></div> 
<div class="TCheckBox" id="CheckBox2" style="position: absolute; top:152px; left: 112px; width: 97px; height: 17px;">CheckBox2<input type="checkbox" name="CheckBox2" value="CheckBox2Checked"checked="checked"></div> 
</fieldset> 
</div> 
<div class="TRadioGroup" id="RadioGroup2"> 
<fieldset style="position: absolute; top:128px; left: 264px; width: 145px; height: 137px;"><legend>RadioGroup2</legend> 

eins: <input type="radio" name="RadioGroup2" value="eins" checked><br> 

zwei: <input type="radio" name="RadioGroup2" value="zwei"><br> 

drei: <input type="radio" name="RadioGroup2" value="drei"><br> 
</fieldset> 
</div> 
</fieldset> 
</div> 
<div class="TMemo" id="Memo1"><textarea name="Memo1" rows="8" cols="13" style="position: absolute; top:320px; left: 88px; width: 185px; height: 89px;"> 
</textarea> 
</div> 
<div class="TComboBox" id="ComboBox2" style="position: absolute; top:328px; left: 296px; width: 145px; height: 21px;"> 
    <select name="ComboBox2"> 
    <option value="a">a</option> 
    <option value="b">b</option> 
    <option value="c">c</option> 
    <option value="d" selected="selected">d</option> 
    <option value="e">e</option> 
</select> 
</div> 
</fieldset> 
</div> 
<div class="TPanel" id="Panel2"> 
<fieldset style="position: absolute; top:32px; left:520px; width: 425px; height: 449px;"> 
<legend></legend> 
<div class="TPanel" id="Panel3"> 
<fieldset style="position: absolute; top:64px; left:552px; width: 345px; height: 185px;"> 
<legend></legend> 
<div class="TMemo" id="Memo2"><textarea name="Memo2" rows="8" cols="13" style="position: absolute; top:88px; left: 584px; width: 185px; height: 89px;"> 
You may wish to leave this memo emptyOr perpahaps give instructions aboout what should be written here</textarea> 
</div> 
<div class="TEdit" id="Edit1" style="position: absolute; top:200px; left: 600px; width: 121px; height: 21px;"><input type="text" name="Edit1"value="Insert text here"></div> 
</fieldset> 
</div> 
<div class="TGroupBox" id="GroupBox3"> 
<fieldset style="position: absolute; top:272px; left:552px; width: 345px; height: 185px;"> 
<legend>GroupBox3</legend> 
<div class="TPanel" id="Panel4"> 
<fieldset style="position: absolute; top:304px; left:584px; width: 177px; height: 137px;"> 
<legend></legend> 
<div class="TRadioGroup" id="RadioGroup1"> 
<fieldset style="position: absolute; top:312px; left: 600px; width: 97px; height: 105px;"><legend>RadioGroup1</legend> 

one: <input type="radio" name="RadioGroup1" value="one"><br> 

two: <input type="radio" name="RadioGroup1" value="two" checked><br> 

three: <input type="radio" name="RadioGroup1" value="three"><br> 
</fieldset> 
</div> 
</fieldset> 
</div> 
<div class="TEdit" id="Edit2" style="position: absolute; top:320px; left: 776px; width: 105px; height: 21px;"><input type="text" name="Edit2"></div> 
</fieldset> 
</div> 
</fieldset> 
</div> 
</form> 
</body> 
</html>

источник

2010-06-03 Mawg

Попробуйте положить <legend>something</legend> элемент перед DIV внутри полей.

Наборы данных - это элементы уровня блока, но вы должны иметь легенду внутри нее для соответствия.

источник

2010-06-03 12:47:33

На http://www.w3.org/TR/REC-html40/interact/forms.html#h-17.10 указано, что '' всегда должен быть первым тегом перед чем-либо еще в ' fieldset'. – sirhc

Это решило проблему проверки, но макет все еще застенчив. Я отредактирую вопрос и обновлю новый HTML – Mawg

. Я дам вам ответ на этот вопрос (хочу, чтобы я мог наградить два), и рассмотрим проблему макета. В случае необходимости я буду как новый вопрос. Однако я обновил HTML выше. – Mawg

HTML: Проблема с гнездом DIVs

ответ

Смежные вопросы