some help with the footer!

co.ador · November 4, 2009

<!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" />
<link type="text/css" href="../stylesheets/webpageprueba.css" rel="stylesheet" media="all" />
<title>www.finefood.com</title>
<script type="text/javascript" src="scripts/prototype.js"></script>
<script type="text/javascript" src="scripts/rating.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">
(
function()
{
  var default_image = $('td.largethumb img').attr('src');
  $('table.smallthumbs a').mouseover(function() { $('td.largethumb img').attr('src', $('img', this).attr('src')); });
});
</script>
</head>

<body>



<div id="sidebar1">
<ul id="mainNav">
      <!--<li id="Vegeterian"><a href="../Vegeterians/index.php" title=" class="first">Home</a></li>
                <li id="takeouts"><li><a href="../../Take Outs/Take Outs frontpage.html" title="">Contact us</a></li>
              <li id="Supermarkets"><a href="../../Supermarkets/Supermarkets frontpage.html" title="">Supermarkets</a></li>
                 <li id="fishmarkets"><a href="../../Fish Markets/Fish Market frontpage.html" title="">Fish Markets</a></li>-->
  </ul>
<!-- end #sidebar1 --></div>
<!--<table id="coloseview">

<a href=""><td width="40" id="contenido1">tropiezo></td></a>
<a href=""><td width="40" id="contenido2">colozar1></td></a>
<a href=""><td width="40" id="contenido3">colozar2></td></a>
<a href=""><td width="40" id="contenido4">colozar3></td></a> 
<a href=""><td width="40" id="contenido4">colozar4></td></a>
<a href=""><td width="40" id="contenido4">colozar3</td></a>
</table>-->


<form class="abajo" action=""> 
<fieldset class="primero">

<legend class="primerosub">Search For a store</legend> 
<fieldset class="segundo1" style="border-color:#FFFFFF" >  
<legend>Location Details</legend>  
<ol>  
<li>  
<label for="name">Name:</label>  
<input name="name" type="text" class="text" id="name" size="20" />  
</li>  
<li>  
<label for="email">Zip Code:</label>  
<input id="email" name="email" class="text" type="text" />  
</li>  
<li>  

<label for="state">State:</label>  
<input id="state" name="state" class="text" type="text" /> 
</li> 
<li><label for="state">Type of food:</label> 
  <select name="food-type" style="width:155px;" >
   <option value="spanish">Spanish Food</option>
      <option>Vegetarian Food</option>
      <option>Culinary Food</option>
      <option>Low fat Food</option>
  </select></li> 
</ol>
</fieldset>

<fieldset class="tercero" style="border-color:#FFFFFF" >
<legend>Services</legend> 
<ol>
<li>
  <input type="checkbox" name="example" value="delivery" />Delivery<br />
  <input type="checkbox" name="example" value="eat-in" />Eat-in<br />

  <input type="checkbox" name="example" value="wifi" />Wi-Fi<br />
  <input type="checkbox" name="example" value="buffet" />Buffet<br />
  <input type="checkbox" name="example" value="tv" />Tv<br />
  <input type="checkbox" name="example" value="parking" />Parking<br />
  <input type="checkbox" name="example" value="catering" />Catering<br />
  <input type="checkbox" name="example" value="take-out" />Take Out

</li></ol>
</fieldset> 
</fieldset>
</form>
         <div class="footer">
           <p><a href="../stores/index.php" >  www.finefood.com </a>Copyright (c)2009</p> 

         </div>

</body>
</html>

CSS

.abajo {background-image:url(../images/fieldsetfront2.gif); 
margin:0;  
padding:0;  
width: 820px; 
height:357px; 
position:relative;  
top:160px; 
left:200px; }

.segundo1{  
float:left;
width:400px; 
height:240px; 
border-color:#FFFFFF;
margin:1em 2em 0 2em;}

.abajo .primero{
margin:0;  
padding: 0;
float:left;
width:99.8%;
height:99.7%
}
.abajo .fieldset{
margin:0;  
padding: 0;
float:left;}

.abajo fieldset legend {  
margin:0; 
color: #000000;  
font-weight:500;
  
}  
.abajo fieldset ol {  
padding: 1em 0.5em 0 0.5em;  
list-style: none;
width:340px; 

} 
.abajo fieldset li {  
padding-bottom: 1em;  
}
.abajo fieldset label {
text-align:right;
float: left;    
width: 10em;    
margin-right: 1em;    
text-align: right; } 
.abajo fieldset label select { vertical-align:middle;}

.tercero { margin-top:1em;  width:200px; height:240px; }
.abajo .primero .tercero ol{  
padding: 0.8em 1em 0 2em;  
list-style: none;
width:100px; ; 
border-color:#FFFFFF;
}



.wrapper {
     min-height: 100%;
    
     height: 100%;
     margin: 0 auto -4em;
}

.footer {
position:relative;
top:310px;
height: 3.5em;
background-image:url(../images/header.gif);
clear:right;
}
.footer p{ position:relative;
vertical-align:baseline;

left:0px; 
border:1px #000000 solid; 
background:#8B3E1D; 
color:#FACF96; 
width:auto;
height:15px;
background:#CC3300;

}
.footer p a{ color:#FACF96; margin-right:10px; }
<!--[if lt IE 8]>

<!--[endif]-->

Guys I tried to put some css together but it is obviously not correct. I still using relative position in places where I shouldn't I still not that clear with the positioning...

haku · November 4, 2009

So do you actually have a question?

Sign In

some help with the footer!

Recommended Posts

co.ador

Link to comment

Share on other sites

haku

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information