Here is my code. I have no idea what is the problem. IMO, everything should be okay.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title></title>
</head>
<body>
<fieldset><legend>Login</legend>
<form id="gronk_login" action="" method="post">
<label for="ccc">Username:
<input type="text" name="ccc" id="ccc" class="formFields" title="Enter your username here" size="12" />
</label>
<label for="ddd">Password:
<input type="password" name="ddd" id="ddd" class="formFields" title="Enter your password here" size="12" />
</label>
<input type="submit" value="Login" name="login_btn" id="login_btn" class="formButtons"/>
</form>
</fieldset>
</body>
</html>The form elements need a container. Like so:
<form id="gronk_login" action="" method="post">
<div>
<label for="ccc">Username:
<input type="text" name="ccc" id="ccc" class="formFields" title="Enter your username here" size="12" />
</label>
<label for="ddd">Password:
<input type="password" name="ddd" id="ddd" class="formFields" title="Enter your password here" size="12" />
</label>
<input type="submit" value="Login" name="login_btn" id="login_btn" class="formButtons"/>
</div>
</form>I have the impression it's due to the input button. An empty form with just the input button doesn't validate. How many ways is there to code a submit button??No. Any form element must be enclosed in a div or anothry type in block element.Even though I have the validated output after having put the elements in a div, I still can't make any sense out of it... glad it works... but can't make sense out of it.Look, everything needs a parent element. inputs are inline elements, like text or images. Basically, you can put multiple inline elements on the same line. However, inline elements must be placed inside of block elements. Block elements take up an entire line, and cannot be placed next to each other without styling. So you need a container element for your inline elements, in this case, a <div>.Originally posted by MstrBob
Look, everything needs a parent element. inputs are inline elements, like text or images. Basically, you can put multiple inline elements on the same line. However, inline elements must be placed inside of block elements. Block elements take up an entire line, and cannot be placed next to each other without styling. So you need a container element for your inline elements, in this case, a <div>.
I'm not so sure that's the reason for enclosing form controls in a block-level element (I could be wrong) — the reason being is that the FORM element is, itself, a block-level element.I thought the FORM element was a block element?
What is even more ridicule, I have to put a hidden input into a div for it to compile... LOL!Generally, a form will be incased inside of a div. I find that if you have a parent div, with your text, and then have your form, you're fine. If you want to control the positioning of the form elements, you have the fieldset elements to allow you to do this, so one div to encase everything should be sufficient. Yes, forms are block elements. It's a mystery to me why they need to be in other elements to be valid. *shurg*Hmm, I have found that it's only required when using HTML 4.01 STRICT doctypes and up. It doesn't require it on 4.01 TRANSITIONAL. I had to use a lower doctype on one of the ASP.net pages I wrote b/c the server writes the viewstate outside of the DIV.Form the HTML 4.01 DTD:
<!ELEMENT FORM - - (%block;|SCRIPT)+ -(FORM) -- interactive form -->Which means that the FORM element:
* Must have a start tag;
* Must have an end tag;
* Must directly contain one or more block level or SCRIPT elements;
* But cannot contain another FORM element.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title></title>
</head>
<body>
<fieldset><legend>Login</legend>
<form id="gronk_login" action="" method="post">
<label for="ccc">Username:
<input type="text" name="ccc" id="ccc" class="formFields" title="Enter your username here" size="12" />
</label>
<label for="ddd">Password:
<input type="password" name="ddd" id="ddd" class="formFields" title="Enter your password here" size="12" />
</label>
<input type="submit" value="Login" name="login_btn" id="login_btn" class="formButtons"/>
</form>
</fieldset>
</body>
</html>The form elements need a container. Like so:
<form id="gronk_login" action="" method="post">
<div>
<label for="ccc">Username:
<input type="text" name="ccc" id="ccc" class="formFields" title="Enter your username here" size="12" />
</label>
<label for="ddd">Password:
<input type="password" name="ddd" id="ddd" class="formFields" title="Enter your password here" size="12" />
</label>
<input type="submit" value="Login" name="login_btn" id="login_btn" class="formButtons"/>
</div>
</form>I have the impression it's due to the input button. An empty form with just the input button doesn't validate. How many ways is there to code a submit button??No. Any form element must be enclosed in a div or anothry type in block element.Even though I have the validated output after having put the elements in a div, I still can't make any sense out of it... glad it works... but can't make sense out of it.Look, everything needs a parent element. inputs are inline elements, like text or images. Basically, you can put multiple inline elements on the same line. However, inline elements must be placed inside of block elements. Block elements take up an entire line, and cannot be placed next to each other without styling. So you need a container element for your inline elements, in this case, a <div>.Originally posted by MstrBob
Look, everything needs a parent element. inputs are inline elements, like text or images. Basically, you can put multiple inline elements on the same line. However, inline elements must be placed inside of block elements. Block elements take up an entire line, and cannot be placed next to each other without styling. So you need a container element for your inline elements, in this case, a <div>.
I'm not so sure that's the reason for enclosing form controls in a block-level element (I could be wrong) — the reason being is that the FORM element is, itself, a block-level element.I thought the FORM element was a block element?
What is even more ridicule, I have to put a hidden input into a div for it to compile... LOL!Generally, a form will be incased inside of a div. I find that if you have a parent div, with your text, and then have your form, you're fine. If you want to control the positioning of the form elements, you have the fieldset elements to allow you to do this, so one div to encase everything should be sufficient. Yes, forms are block elements. It's a mystery to me why they need to be in other elements to be valid. *shurg*Hmm, I have found that it's only required when using HTML 4.01 STRICT doctypes and up. It doesn't require it on 4.01 TRANSITIONAL. I had to use a lower doctype on one of the ASP.net pages I wrote b/c the server writes the viewstate outside of the DIV.Form the HTML 4.01 DTD:
<!ELEMENT FORM - - (%block;|SCRIPT)+ -(FORM) -- interactive form -->Which means that the FORM element:
* Must have a start tag;
* Must have an end tag;
* Must directly contain one or more block level or SCRIPT elements;
* But cannot contain another FORM element.