html - moving body down page -
i want move content on page down.. have included 'padding-top:50px;' in body tag, move content down.. ok good. place content in newly created 50px space. nothing appears or cut off because guess out-of-bounds of page?
i have made wrapper div , placed page content in , moved down, still same effect of not seeing in newly created space. reacts same.
any suggestions?
thanks
<style> #body{ padding-top: 50px; } #cookietext{ z-index:10000; position:absolute; top:-30px; left:327px; width:270px; font-family:arial, sans serif; font-size:9px; color:#313131; line-height:12px; padding:5px 60px 5px 40px; border-radius: 2px; background-color:#efeff0; border: 1px solid #bec2c3; } #cookiebtn{ position:absolute; top:5px; right:10px; font-family:arial, sans serif; font-size:10px; color:#fff; line-height:12px; padding:5px 5px 5px 5px; border-radius: 5px; background-color:#83878f; border: 1px solid #7c8089; cursor: pointer; } </style> <div id="cookietext"> installing blah blah blah <div id="cookiebtn"><b>got it!</b></div> </div> <script src="//code.jquery.com/jquery-1.10.2.js"></script> <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <script> $("#cookiebtn").click(function(){ $("#cookietext").stop().animate({"top": "-100px"}, 200); }); $("#cookiebtn").click(function(){ $("#body").stop().animate({"top": "-50px"}, 200); }); </script>
you shouldn't use padding push down "body" of page. instead block above content inside body.
<body> <div class="someheader">fooheader</div> <div class="somecontent">foocontent</div> </body>
and in css specify
.someheader { height: 50px; }
Comments
Post a Comment