Short-Order-Coder
asked on
An easily hard css question
I am trying to control the space above and below <P> tags. They are in a form and surrounding label and input tags.
This usually isn't a problem.
This usually isn't a problem.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>
<head>
<style type="text/css">
<!--
#middy {
width:802px;
background-color: #FFF;
margin:auto;
height:100%;
}
html,body {
height: 100%;
}
body {
background-color:#CCCCCC;
margin:0px;
}
#topper{
width:802px;
height:174;
padding:0px;
margin:0px;
vertical-align:top;
}
#starTop{
background-image:url(imgs/stars-bar-bg.png);
height:32px;
padding:0px;
margin:0px;
vertical-align:top;
text-align:center;
}
#naver{
width:760px;
border-top:#8797a6 solid 3px;
border-right:0px;
border-left:0px;
border-bottom:#8797a6 solid 3px;
text-align:center;
margin:10px 21px;
font-family:Arial, Helvetica, sans-serif, "Century Gothic";
}
#naver ul{
margin:0px;
padding:0px 0px 2px 0px;
list-style:none;
width:760px;
font-weight:bold;
color:#3f3f3f;
}
#naver li{
display:inline;
padding:0px 10px;
font-size:10pt;
}
#naver li a, a:active, a:visited{
text-decoration:none;
color:#3f3f3f;
}
#naver li a:hover{
background-color:#e6f0f9;
}
#naver li:hover{
background-color:#e6f0f9;
}
#leftbod{
width:390px;
margin:0px 0px 30px 30px;
text-align:justify;
float:left;
color:#99999b;
}
#rightbod{
width:360px;
float:right;
}
#rightbod label{
color:#99999b;
text-align:left;
float:left;
width:95px;
font-size:10pt;
font-family:Arial, Helvetica, sans-serif, "Century Gothic";
}
.formTop{
margin:40px 0px 15px 0px;
color:#Fbf1c2d;
font-family:Arial, Helvetica, sans-serif, "Century Gothic";
}
.texta{
width:230px;
border:#99999b solid 2px;
background-color:#;
font-size:10pt;
font-family:Arial, Helvetica, sans-serif, "Century Gothic";
}
.starTop{
text-align:center;
margin:20px 0px 20px 0px;
}
fieldset {
border:0px;
padding:1px;
}
#rightbod p{
display:compact;
}
-->
</style>
</head>
<body>
<div id="middy">
<div id="topper">
<img src="imgs/topBan2.png" height="174" width="802" />
</div><!--end topper-->
<div id="starTop">
<img style="padding-top:5px;" src="imgs/stars.png" height="37" width="255" />
</div><!--end star top-->
<div id="naver">
<ul>|
<li>
<A href="#">Nav 1</A>
</li>
|
<li>
<A href="#">Nav 2</A>
</li>
|
</ul>
</div><!--End nav-->
<div id="leftbod">
<div class="starTop"><img src="imgs/stars.png" /></div>
<p>We are experts at loan modification. We can help people affected by bankruptcy or foreclosure by modifying their loans. Our single objective is to help you keep your family in your home. You need professional help. </p>
<p>One of the biggest mistakes people make is to try and modify their own loan. It is far more involved than you may be aware. We're the experts and will do a better job than you can and get it accomplished faster. We fight for you. We are your advocate.</p>
<p>Call Now: toll free no obligations. Se habla Espanol. 877-500-3001 </p>
</div><!--end leftbod-->
<div id="rightbod">
<div class="formTop">
Call Now
</div><!--formTop-->
<div id="reqForm">
<cfform action="thankYou.cfm" method="post" id="requestInfo">
<fieldset>
<p><label for="firstName">First Name</label><cfinput class="texta" type="text" name="firstName"></p>
<p><label for="lastName">Last Name</label><cfinput class="texta" type="text" name="lastName"></p>
</fieldset>
<fieldset>
<p><label for="address">Address</label><cfinput class="texta" type="text" name="address" /></p>
<p><label for="address2">Address</label><cfinput class="texta" type="text" name="address2" /></p>
<p><label for="city">City</label><cfinput class="texta" type="text" name="city" /></p>
<p><label for="state">State</label><cfinput class="texta" type="text" name="city" /></p>
</fieldset>
<input type="submit" name="submit" value="submit" />
</cfform>
</div><!--end reqForm-->
</div><!--end rightbod-->
</div><!--end middy-->
</body>
</html>
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER