html - css add space above footer -


i have css code html add space above footer since tables stick footer directly.

please make sure every time add table space should there. between tables , footer.

you can view code @ http://jsfiddle.net/hadinetcat/e8jd3/6/

css code

<style type='text/css'>    .container3 { float:left; width:100%; /*background:green;*/ overflow:hidden; position:relative; } .container2 { float:left; width:100%; background:#ffa500; position:relative; right:45%;  } .container1 { float:left; width:100%; /*background:red;*/ position:relative; right:40%; }  .col1 { float:left; width:26%; position:relative; left:87%; overflow:hidden; height:570px;  }  .col2 { float:left; width:50%; position:relative; left:90%; overflow:hidden;  }  .col3 { float:left; width:26%; position:relative; left:80%; overflow:hidden;  }  .footer {         border:1px solid orange;         position: relative;         padding:0px;         margin-top:-5px;     font-size:15px;       }   .signout { position:       absolute; width:          200; bottom:         150px; left:           5px; clear: both; font-size:20px; text-align:center }  </style> 

html

<div id="header" style="background-color:#ffa500;">  <h1 style="margin-bottom:0;">wellcome balhalfe services customer reports</h1>  <div class="container3 "> <div class="container1 "> <div class="container2 ">   <div class="col1">  lalalallalalalallala <br /> lllllllllllllllllllll <br />  </div>   <div class="col2">  <div align="center">         <h2 align="center"> report table</h></div>   <table border="1" align="center">          <tr>                 <td><b>name</b></td>                 <td><b>mime</b></td>                 <td><b>size (bytes)</b></td>                 <td><b>created</b></td>                 <td><b>download</b></td>             </tr>                 <tr>                 <td>1594(ha 10 al haaly).pdf</td>                 <td>application/pdf</td>                 <td>60964</td>                 <td>2013-08-29 23:40:07</td>                 <td><a style='text-decoration:none;'href=' get_file_work.php?id=6&company=companya'>download</a></td>             </tr>  <tr>                 <td>eu contres.txt</td>                 <td>text/plain</td>                 <td>546</td>                 <td>2013-08-22 00:06:55</td>                 <td><a style='text-decoration:none;'href=' get_file_work.php?id=4&company=companya'>download</a></td>             </tr>  <tr>                 <td>1594(ha 10 al haaly).pdf</td>                 <td>application/pdf</td>                 <td>60964</td>                 <td>2013-08-29 23:40:07</td>                 <td><a style='text-decoration:none;'href=' get_file_work.php?id=6&company=companya'>download</a></td>             </tr> <tr>                 <td>1594(ha 10 al haaly).pdf</td>                 <td>application/pdf</td>                 <td>60964</td>                 <td>2013-08-29 23:40:07</td>                 <td><a style='text-decoration:none;'href=' get_file_work.php?id=6&company=companya'>download</a></td>             </tr> <tr>                 <td>1594(ha 10 al haaly).pdf</td>                 <td>application/pdf</td>                 <td>60964</td>                 <td>2013-08-29 23:40:07</td>                 <td><a style='text-decoration:none;'href=' get_file_work.php?id=6&company=companya'>download</a></td>             </tr> <tr>                 <td>1594(ha 10 al haaly).pdf</td>                 <td>application/pdf</td>                 <td>60964</td>                 <td>2013-08-29 23:40:07</td>                 <td><a style='text-decoration:none;'href=' get_file_work.php?id=6&company=companya'>download</a></td>             </tr> <tr>                 <td>1594(ha 10 al haaly).pdf</td>                 <td>application/pdf</td>                 <td>60964</td>                 <td>2013-08-29 23:40:07</td>                 <td><a style='text-decoration:none;'href=' get_file_work.php?id=6&company=companya'>download</a></td>             </tr> <tr>                 <td>1594(ha 10 al haaly).pdf</td>                 <td>application/pdf</td>                 <td>60964</td>                 <td>2013-08-29 23:40:07</td>                 <td><a style='text-decoration:none;'href=' get_file_work.php?id=6&company=companya'>download</a></td>             </tr> <tr>                 <td>1594(ha 10 al haaly).pdf</td>                 <td>application/pdf</td>                 <td>60964</td>                 <td>2013-08-29 23:40:07</td>                 <td><a style='text-decoration:none;'href=' get_file_work.php?id=6&company=companya'>download</a></td>             </tr> <tr>                 <td>1594(ha 10 al haaly).pdf</td>                 <td>application/pdf</td>                 <td>60964</td>                 <td>2013-08-29 23:40:07</td>                 <td><a style='text-decoration:none;'href=' get_file_work.php?id=6&company=companya'>download</a></td>             </tr> <tr>                 <td>1594(ha 10 al haaly).pdf</td>                 <td>application/pdf</td>                 <td>60964</td>                 <td>2013-08-29 23:40:07</td>                 <td><a style='text-decoration:none;'href=' get_file_work.php?id=6&company=companya'>download</a></td>             </tr> <tr>                 <td>1594(ha 10 al haaly).pdf</td>                 <td>application/pdf</td>                 <td>60964</td>                 <td>2013-08-29 23:40:07</td>                 <td><a style='text-decoration:none;'href=' get_file_work.php?id=6&company=companya'>download</a></td>             </tr> </table>  </div>  <div class="col3">  </div>  </div>  </div>  <div class="signout">  <a  style='text-decoration:none;' href= "index.html">sign out </br></a>  </div>  <div class="footer" style="background-color:#ffa500;clear:both;text-align:center;"> copyright © balhalfe services 20103-2014</div>  </div> 

here updated fiddle

add pixels table margin-bottom in css.

for example

table{     margin-bottom:60px; } 

Comments

Popular posts from this blog

java.util.scanner - How to read and add only numbers to array from a text file -

rewrite - Trouble with Wordpress multiple custom querystrings -