/* Backgroud Top Title Header */ html { font: 13px 'Open Sans', 'Helvetica', Sans-serif; } header { -o-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; padding: 0px 0; position: fixed; top: 0; width: 100%; background: #444; border-bottom: 3px solid #333;} /*Code Bottom*/ background: #000; } #logo:active { position: relative; top: 1px; } html { height: 100%; background-color: #333; background-image: linear-gradient(135deg, #444, #333); } body { margin: 0; } .controls { width: 100%; border-top: 1px solid; position: fixed; bottom: 0; color: #afa; } .controls__button { box-sizing: border-box; width: 5,4em; border: none; vertical-align: middle; cursor: pointer; font-size: inherit; -webkit-font-smoothing: antialiased; line-height: 7.65em; color: currentcolor; background-color: transparent; } .controls__button:hover, .controls__button:focus, .controls__button.is-active { color: #222; background-color: #dad; } .controls__button:focus { outline: none; } .controls__button.is-active:hover, .controls__button.is-active:focus { color: currentcolor; background-color: #222; }
<header> <div class="page-wrap clearfix"> <p align="center"> <font size="3" color="green"face="arial"> <a href="http://demoshow-mys2010.blogspot.co.id/p/logo-mys2010.html" title="Myscript2010">LOGO MYS2010</a> </header>
<p align="center"> <a href="http://demoshow-mys2010.blogspot.co.id/2016/02/logo-mys2010.html"> <img src="https://sites.google.com/site/pelajaranku1/fileku/logo-mys2010.png" name="e902" border="0" width="300" height="200" /></a> <font size="2" color=" green "face="Time newroman">CIBEBER CIMAHI</font> </center>
<div class="controls"> <button class="controls__button"> Myscript2010</button><!-- --><button class="controls__button">Mylogo</button><!-- --><button class="controls__button">Call307</button> </div>
Edited by. Myscript2010 on Codepen