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

Archived

Browse

Activity

Important Information