DZone Snippets is a public source code repository. Easily build up your personal collection of code snippets, categorize them with tags / keywords, and share them with the world

Snippets has posted 5883 posts at DZone. View Full User Profile

CSS For Field Editor

08.10.2007
| 4625 views |
  • submit to reddit
        // description of your code here

// insert code here..
<html>
<head>
	<title>Test</title>
	<style>
		body { margin: 0px; font: 1em Tahoma, Verdana, Arial, Helvetica, "Bitstream Vera Sans", sans-serif; }

		.content { margin: 20px 10px; }

		.fields { font-size: 0.9em; background-color: #F2F2F4; padding: 15px 0 15px 0; display: block; }

		fieldset { font-size: 0.9em; border: 0; padding: 0; clear: both; }

		fieldset label { width: 12em; float: left; margin: 0 7px 0 0; text-align: right; font-weight: bold; clear: left; }

		fieldset .fieldscontainer { display: block; float: left; padding: 0 0 15px 0; }

		fieldset .fieldcontainer { float: left; padding: 0; margin: 0 5px 5px 0; }

		fieldset .fieldcontainer label { display: block; font-size: 0.9em; width: auto; text-align: left; font-weight: normal; clear: none; }

		fieldset .clearleft { clear: left; }
	</style>
</head>

<body>
<div class="content">

<div class="fields">
	<fieldset>
		<label>Name:</label>
		<div class="fieldscontainer">
			<div class="fieldcontainer">
				<input type="text" name="firstname" value=""/>
				<label>First</label>
			</div>
			<div class="fieldcontainer">
				<input type="text" name="middlename" value=""/>
				<label>Middle</label>
			</div>
			<div class="fieldcontainer">
				<input type="text" name="lastname" value=""/>
				<label>Last</label>
			</div>
		</div>
		<div class="clearleft"></div>

		<label>Email address:</label>
		<div class="fieldscontainer">
			<div class="fieldcontainer">
				<input type="text" name="email" value=""/>
				<label>This is your email address</label>
			</div>
		</div>
		<div class="clearleft"></div>
	</fieldset>

	<fieldset>
		<label>Description:</label>
		<div class="fieldscontainer">
			<div class="fieldcontainer">
				<textarea name="description" cols="50" rows="5"></textarea>
			</div>
		</div>
		<div class="clearleft"></div>
	</fieldset>
</div>

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