html - How to get border to cover entire div -
i trying border around container container-body section of page covering top part of page until resize. added new div , added id "main-box" specific purpose, same thing happening. code , screenshot included below. missing? using bootstrap if helpful.
thanks eliza
/*! * start bootstrap - small business html template (http://startbootstrap.com) * code licensed under apache license v2.0. * details, see http://www.apache.org/licenses/license-2.0. */ body { font-family: 'palatino linotype', serif; font-size: 16px; } .header { background-color: rgb(42, 94, 142); color: white; width: 100%; } .header h1 { padding: 10px; padding-bottom: 15px; } .first { font-size: 90%; } .container-body { width: 100%; } .main-box { border: 1px black solid; } #no-bullets { list-style-type: none; } .navbar .nav li a:hover, .navbar .nav li a:focus, #cv { color: #b29600; background: white; } .navbar-default .navbar-nav > .active >a { color: #b29600; background: transparent; ; } #title-text { padding-bottom: 35px; } #main-info { background-color: rgba(198, 217, 241, 0.3); margin-top: 20px; padding: 50px; } .title-font { font-size: 20px; font-weight: bolder; } .navbar-fixed-top .navbar-brand { padding: 0 15px; } .navbar-fixed-bottom { background: white; } #map { padding: 20px; width: 100%; } #footer-text { color: black; font-size: 9px; width: 100%; text-align: center; padding-top: 10px; font-weight: 100px; } .active { color: rgb(0, 176, 240); } .contact-text { color: rgba(0, 176, 240, 1); text-decoration: underline; font-size: 14px; ; ; line-height: 20px; ; ; } #footer-text { color: black; text-decoration: underline; } #footer-background { background: rgba(217, 217, 217, .3); } @media(min-width:768px) { body {} .navbar-fixed-top .navbar-brand { padding: 15px 0; } } @media(max-width: 1095px) { #motto { font-size: 14px; } } @media(min-width: 1095px && max-width:1500px) { #motto { font-size: 16px; } .nav li { padding-top: 0px; padding-right: 0px; padding-left: 0px; padding-bottom: 0px; } #logo_small { display: block; } #logo { display: none; } } @media(min-width :1500px) { #motto { font-size: 30px; } } <!-- page content --> <div class="container container-body"> <div class="main-box"> <div class="header"> <h1 id="title-text"><span class="first">l</span> w <span class="first"> o </span>f f c e s o f <br> <span class="first">s </span>a r h <span class="first">d </span>i n e <span class="first">m </span>c <span class="first">s </span>h e a</h1> </div> <h3 id="motto">l e g a l e t h i c s a n d p r o f e s s i o n a l r e s p o n s i b i l i t y</h3> <!-- heading row --> <div class="row"> <!-- navbar doesn't collapse --> <ul id="no-bullets" class="col-md-3"> <li class="active"> <a href="index.html" class="active">home</a> </li> <li> <a href="practiceareas.html">practice areas</a> </li> <li> <a href="biography.html">biography</a> </li> <li> <a href="professional.html">professional activites</a> </li> <li> <a href="professional.html"> publications</a> </li> <li> <a href="contact.html">contact</a> </li> </ul> <!-- /.col-md-8 --> <div id="main-info" class="col-md-8"> <h4><strong>sarah diane mcshea</strong><small> has practiced in professional responsibility field since 1980. law practice devoted advising lawyers , law firms on professional responsibility matters, including</small></h4> <ul> <li>advisory ethics opinions <br> </li> <li>expert witness on legal ethics , attorney discipline issues</li> <li>disqualification , sanctions litigation in federal , state courts</li> <li>risk management law firms</li> <li>law firm disputes , dissolutions</li> <li>bar admission proceedings</li> <li>disciplinary defense in bar investigations , prosecutions</li> </ul> </div> <!-- /.col-md-8 --> </div> <!-- /.row --> </div> <!-- /main-info --> </div> <!-- /container-body --> <!-- footer --> <div class="navbar navbar-fixed-bottom"> <div class="container"> <div class="row"> <div class="col-md-6"> <p>2 6 <span class="first2">b</span> r o d w y , <span class="first2">1 8</span> t h <span class="first2">f</span> l o o r <br> <span class="first2">n</span> e w <span class="first2">y</span> o r k , <span class="first2">n y</span> , 1 0 0 0 4 <br> <span class="first2">t</span> e l : 2 1 2 - 6 7 9 -9 0 9 0 <br> </p> <p> </div> <!-- /.col-md-6 --> <div class="col-md-6"> <p><a class="contact-text email-alert" href="mailto:sdm@mcshealaw.com">s d m @ m c s h e l w . c o m</a> <br> <a class="contact-text" href="#">d r e c t o n s</a> </p> </div> <!-- /.col-md-6 --> </div> <!-- /.row --> </div> <div id="footer-background" class="col-md-12"> <p id="footer-text">2015 law offices of sarah diane mcshea / peer rated av preeminent ® 5.0 out of 5 / 2015 new york area "super lawyer" / attorney advertising / <a href="doc/disclaimer.pdf">disclaimer</a> / site map</p> </div> <!-- /.col-md-12 --> </div> </div> <!-- /.container -->
your question not clear me, if have make border body container, can use 4 fixed div elements it, each 1 placed @ 4 edge of page.
html
<div id="left"></div> <div id="right"></div> <div id="top"></div> <div id="bottom"></div> css
#top, #bottom, #left, #right { position: fixed; } here working demo.
read this post full reference.
Comments
Post a Comment