Search code examples
htmlcsslayoutfooter

i create footer which i want to customize

I create footer element and i want to customize it! everuthing is ok but when i'm trying to insert like copyright notice or site statistic counter it's goes unresponsive! i don't understand what happening! if anyone will remake it pleas instead of counters and copyright notice insert image 88x33!

thanks!

this is code

#footer {
  margin-top: 10px;
  background:#fff;
  padding:20px;
  -moz-box-shadow:0 1px 2px rgba(0,0,0,.5);
  -webkit-box-shadow:0 1px 2px rgba(0,0,0,.5);
  box-shadow:0 1px 2px rgba(0,0,0,.5);
   border-bottom: 4px solid #005ce6;
  -webkit-border-top-left-radius:10px;
  -webkit-border-top-right-radius:10px;
  -moz-border-radius-topleft:10px;
  -moz-border-radius-topright:10px;
  border-top-left-radius:10px;
  border-top-right-radius:10px;
}
.foot-l {
  float:left;
  width:70%;
  padding:14px 0 0;
}
.foot-r {
  float:right;
  width:30%;
  text-align:right;
}
.clr{
  text-align: left;
}
#footer a {
  color:#009bc0;
}
footer {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
<footer>
 <div class="wrapper">
  <div id="footer">
   <div class="foot-r">
    <ul style="float:right;">
      <li style="list-style-type: none; float: left; display: inline-block; margin-right: 15px;">
     <!-- TOP.GE COUNTER CODE -->
       <div style="position: relative; width: 88px;">
        <div style="background:url('/pngs/hat_2.png');position:absolute;width:38px;height:52px;overflow:hidden;margin-left:-13px;margin-top:-6px"></div>
         <script language="JavaScript" type="text/javascript" src="//counter.top.ge/cgi-bin/cod?100+103590"></script>
         <noscript>
         <a target="_top" href="http://counter.top.ge/cgi-bin/showtop?103590">
         <img src="//counter.top.ge/cgi-bin/count?ID:103590+JS:false" border="0" alt="TOP.GE" /></a>
         </noscript>
        </div>
       <!-- / END OF TOP.GE COUNTER CODE -->
      </li>
      <li style="list-style-type: none; float: left; display: inline-block;">
  <div style="position: relative; width: 88px;">
       <div style="background:url('/pngs/hat_3.png');position:absolute;width:38px;height:52px;overflow:hidden;margin-left:-13px;margin-top:-6px"></div>
        $COUNTER$
       </div>
      </div>
     </li>
     </ul>
   </div>

   <div class="foot-l">
<!-- <copy> -->Tech Info <img src="/icons/ic_copyright_black_48dp_1x.png" alt"copyright" width="15" height="15"/> $YEAR$<!-- </copy> -->$POWERED_BY$   
  </div>
    <div class="clr"></div>
  </div>
 </div>
</footer>

This is result 1

Solution

  • It seems that you have an extra closing tag for DIV, right after the UL tag. (Line 26, in your HTML code snippet) Remove it, and I think it will be fine.