I have been working on a simple HTML form that I styled with CSS. I attempted to adjust the size of the submit button using the height
attribute, but for some unknown reasons, it just wouldn't cooperate. However, when I tried using the width
attribute, it worked perfectly fine. Interestingly, increasing the font-size
attribute did affect the height of the button to some extent. Yet, once the font-size
went beyond 20px
, it stopped responding altogether.
My browser of choice is Safari.
div {
background-color:cadetblue;
padding: 10px;
border: 1px black solid;
}
form {
margin-left: -15px;
}
label {
display:block;
}
fieldset {
border: none;
display: inline;
}
input[type="submit"] {
padding: 0px;
height: 5em;
}
input[type="text"] {
margin-left: 0px;
width: 200px;
height: 20px;
}
<div>
<p>HTML FORM: nameform.htm - programmed by {Maihan Nijat!}</p>
<form method="post" action="greeting.php">
<fieldset>
<label for="firstname" >Please enter your first name:</label>
<input name="firstname" type="text" />
</fieldset>
<input type="submit" value="Submit!" />
</form>
<hr>
<p>Copyright © 2014 <a href="http://www.php.net">The PHP Web Site</a>
</p>
</div>