html - Side banner on a webpage -
how make banners along top , bottom of page (http://i.imgur.com/sxjbcjv.jpg) instead @ both sides of page?
i have them both fixed top , bottom of page:
#header { position: fixed; top: 0; width: 100%; height: 66px; z-index: 999; } #footer { position: fixed; bottom: 0; width: 100%; height: 66px; z-index: 999; }
and html:
<body> <div id="wrapper"> <a href="project.html"> <div id="header"> <button id="next-button" href="project.html"><i class="fa fa-arrow-circle-right fa-4x"></i> </button> </div> </a> <div id="main"> <div id="splash"> <div id="name"> <h1 class="wow animated flipinx">max wilson</h1> </div> <div id="profile"> <img src="img/logo.png" class="wow animated rollin" data-wow-delay="1s"> </div> <div id="subtext"> <h2 class="wow animated fadeinup" data-wow-delay="2s">aspiring developer </h2> </div> </div> </div> </div> <a href="project.html"> <div id="footer"> <button id="prev-button" href="project.html"><i class="fa fa-arrow-circle-left fa-4x"></i> </button> </div> </a>
thanks in advance! max
have tried floating header , footer left?
for example:
#header { position: relative; float: left; width: 50px; height: 500px; background-color: #44f; } #footer { position: relative; float: left; width: 50px; height: 500px; background-color: #44f; } #wrapper{ text-align: center; margin-left: auto; margin-right: auto; } #main{ width: 800px; float:left; }
Comments
Post a Comment