1

I'm trying to position vertical footer. I have text and logo in it. Logo is aligned right. It has height 38 and footer must be with height of 80px. But I can't align them vertical both text and logo.

#footer { height: 80px; }
#footer .text{margin: 0 auto; width: 1024px; padding-top: 35px;vertical-align:middle;}
#footer .text #logo-footer {background:url("image.png") ; float:right; margin-right:0;width:172px;height:38px;}
<div id="footer">
<div class="text">
  some text here
  
  <div id="logo-footer"></div>
</div>

</div>
ivva
  • 2,819
  • 9
  • 31
  • 64

1 Answers1

1

You could use display:table-cell and line-height:38px; for this.

#footer { height: 80px; display:table;background:red;}
#footer .text{display:table-cell;margin: 0 auto; width: 1024px;height:100%; vertical-align:middle;line-height:38px;}
#footer .text #logo-footer {background:url("image.png") ; float:right; margin-right:0;width:172px;height:38px;}

I made a fiddle here:

https://jsfiddle.net/d3m7yxrg/

andrrs
  • 2,289
  • 3
  • 17
  • 25
  • Thanks, I tried it and it's positioned good! But I added t #footer {width: 100%;} and how to position .text and .logo-footer horizontal in the middle and its width to be 1024px; – ivva Nov 15 '15 at 10:29