Magic submit button!
The following code seems to be valid:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head>
<title>Sample Form</title>
<style type="text/css">
inpu开发者_开发百科t {width:500px; padding:3px; background:green; border:1px solid red;}
textarea {width:500px; height:150px; padding:3px; background:green ; border:1px solid red;}
</style>
</head>
<body>
<form action="">
<p><input id="entry_0"><label for="entry_0">Name</label></p>
<p><input id="entry_1"><label for="entry_1">Email</label></p>
<p><input id="entry_2"><label for="entry_2">URL</label></p>
<p><textarea id="entry_3" rows="5" cols="5"></textarea></p>
<p><input type="submit" value="Submit"></p>
</form>
</body>
</html>
However, the submit button width is shorter than other fields. Strangely when I remove the doctype declaration, they all get the same length. What am I doing wrong and how can I make them the same size?
Thanks in advance! Rain Lover
Just add
webkit-box-sizing: content-box ; /* Safari/Chrome, other WebKit */
-moz-box-sizing: content-box ; /* Firefox, other Gecko */
box-sizing: content-box ; /* Opera/IE 8+ */
to your input css rule, to be sure.
Note: It is a CSS3 property, so it is not applicable to non-modern browsers.
Reference: http://www.w3.org/TR/css3-ui/#box-sizing
input {display:block; width:500px; padding:3px; background:green; border:1px solid red;}
This should work. Adding Display:Block; will make your width and height attributes work properly.
加载中,请稍侯......
精彩评论