Set text field background

  


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
* {
  margin: 0;
  padding: 0
}

html,body {
  height: 100%
}

#wrapper {
  height: 100%;
  width: 100%;
  display: table;
  vertical-align: middle;
}

#outer {
  display: table-cell;
  vertical-align: middle;
}

#formwrap {
  position: relative;
  left: 50%;
  float: left;
}

#form1 {
  border: 1px solid #000;
  padding: 20px 20px;
  position: relative;
  text-align: right;
  left: -50%;
}

p {
  margin: 1em 0
}

input {
  position: relative;
  background: #ffffcc
}
</style>

</head>
<body>
<div id="wrapper">
  <div id="outer">
    <div id="formwrap">
      <form id="form1" method="post" action="">

        <p>
          <label for="t1">Name: </label>
          <input type="text" name="t1" id="t1" value="I'm in the middle" />
        </p>
        <p>
          <label for="t2">Password: </label>
          <input type="password" name="t2" id="t2" />
        </p>

      </form>
    </div>
  </div>
</div>
</body>
</html>

Related examples in the same category

1.	'textarea' creates a multiline text entry control
2.	textarea width:400px;
3.	textarea padding:2px;
4.	textarea font: normal 1em Verdana, sans-serif;
5.	textarea border:1px solid #eee;
6.	textarea height:100px;
7.	textarea display:block;
8.	textarea color:#777;
9.	textarea width: 280px;
10.	textarea border: 1px solid #EFEFEF;
11.	textarea font: normal 1em Verdana, 'Trebuchet MS', Tahoma, sans-serif;
12.	textarea color: #666666;
13.	textarea width: 300px; height: 100px; background-color: yellow;
14.	textarea font-size: 1em; font-weight: bold; font-family: Verdana, Arial, Helvetica, sans-serif;
15.	textarea border: 1px solid black;
16.	textfield display: block;
17.	textfield width: 250px;
18.	textfield border: 1px solid #AF9D72;
19.	textfield background-color: #F2ECD7;
20.	Textarea float: left;
21.	Textarea height: 72px;
22.	Textarea width: 370px;
23.	Textarea border-bottom: 1px solid #847F7A;
24.	Textarea border-right: 1px solid #847F7A;
25.	Textarea border-top: 2px solid #847F7A;
26.	Textarea border-left: 2px double #847F7A;
27.	Textarea margin: 4px 0 0 0;
28.	Textarea overflow: hidden
29.	Textarea with column and row setting
30.	The textarea element
31.	textarea name="hobbies" rows="7" cols="40"
32.	Text Field wiht size and maxlength
33.	A Simple Text Field
34.	Setting the value of a text field
35.	Single line text input control
36.	input type = "text" inserts a text box
37.	A prepopulated text field with a maximum length
38.	Text field border style
39.	Text input sizes
40.	Multi line text input control
41.	textarea creates a multiline textbox
42.	White space is preserved in a text area
43.	Set background color for textarea
44.	set font size, weight, family for textarea
45.	Set border for a textarea to '1px solid black'
46.	Set width and height for textarea
47.	Set required textarea field to have solid border and highlight color
48.	textarea:focus

Set text field background : textarea « Form « HTML / CSS

Related examples in the same category