PDA

View Full Version : algining form ...


nits4u
05-22-2010, 05:19 AM
I want this simple form:
http://img163.imageshack.us/img163/7443/assebledfinalprod.png (http://img163.imageshack.us/i/assebledfinalprod.png/)

Uploaded with ImageShack.us (http://imageshack.us)

1. I can not align the "select" & "input" boxes. I have even tried by giving width to labels, but no use.
2. Also how to position the buttons?
here is the code.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Assemble Final Product</title>
<style type="text/css">
*{
margin:0;
padding:0;
}
body{
font-family:arial;
font-size:1em;
}
#container{
width:70%;
margin:5px auto;
border:1px solid #7F9DB9;

}
#head{
background:#DBDCE9;
padding:5px 2px;
padding-bottom:20px;
border-bottom:2px solid #C9CBCE;
}
form{
padding-top:10px;
background:#F4F2EC;
padding-bottom:10px;
padding-left:5px;
}
.assembly{
float:left;
width:40%;
}
label,fieldset p{
font-size:.8em;
padding-left:5px;
margin-bottom:5px;
}
fieldset{
padding-bottom:10px;
}
legend{
font-size:.8em;
color:#0046D5;
padding:3px;
}
.asmbly_table{
width:59%;
float:left;
margin-left:5px;
}
.asmbly_table table{
width:90%;
border:1px solid #7F9DB9;
}
.asmbly_table table th{
font-weight:normal;
font-size:.9em;
}
.btn{
clear:both;
}
</style>
</head>
<body>
<div id="container">
<div id="head">
<h3>Assemble Final Products</h3>
<p>Use this command to assemble final product frim raw material.</p>
</div>
<form name="assemble" id="assemble" action="">
<div class="assembly">
<label for="asmbly">Assembly</label>
<select name="asmbly">
<option></option>
<option></option>
</select> <br /><br />
<label for="qty">Quantity</label>
<input type="text" name="qty" id="qty" /><br /><br />
<label for="date">Date:</label>
<input type="text" name="date" id="date" /><br /><br />
<fieldset>
<legend>Details</legend>
<p>Currently in stock:</p>
<p>Assembled Limit:</p>
<p>Estimated unit cost:</p>
</fieldset>
</div>
<div class="asmbly_table">
<label for="tble">Required Components:</label>
<table>
<th>SKU</th>
<th>Item Name</th>
<th>Stocked</th>
<th>Required</th>
</table>
</div>
<div class="btn">
<button type="submit" >OK</button>
<button type="reset" >Close</button>
</div>
</form>
</div>
</body>
</html>

Is there any way to check the font type in a design ? n y plug-in or something by which one can apply same font easily.

edbr
05-22-2010, 05:28 AM
.btn{
clear:both; float , margin etc as you have a class for them
}

nits4u
05-30-2010, 01:38 PM
Is there any way to check the font type in a design ? any plug-in or something by which one can know the font-family easily. ??

edbr
05-31-2010, 02:23 AM
if its text look in the style sheet .

or if not try here
http://new.myfonts.com/WhatTheFont/