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 &nbsp;<span class="first"> o </span>f f c e s &nbsp; o f <br>          <span class="first">s </span>a r h &nbsp; <span class="first">d </span>i n e &nbsp; <span class="first">m </span>c <span class="first">s </span>h e a</h1>      </div>      <h3 id="motto">l &nbsp;e &nbsp;g &nbsp;a &nbsp;l &nbsp; &nbsp; e &nbsp;t &nbsp;h &nbsp;i &nbsp;c &nbsp;s &nbsp; &nbsp; &nbsp;a &nbsp;n &nbsp;d &nbsp; &nbsp; &nbsp;p &nbsp;r &nbsp;o &nbsp;f &nbsp;e &nbsp;s &nbsp;s &nbsp;i &nbsp;o &nbsp;n &nbsp;a &nbsp;l &nbsp; &nbsp; &nbsp;r &nbsp;e &nbsp;s &nbsp;p &nbsp;o &nbsp;n &nbsp;s &nbsp;i &nbsp;b &nbsp;i &nbsp;l &nbsp;i &nbsp;t &nbsp;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 &nbsp; <span class="first2">b</span> r o d w y , &nbsp; <span class="first2">1 8</span> t h &nbsp; <span class="first2">f</span> l o o r            <br>            <span class="first2">n</span> e w &nbsp; <span class="first2">y</span> o r k , &nbsp; <span class="first2">n y</span> , &nbsp; 1 0 0 0 4            <br>            <span class="first2">t</span> e l : 2 1 2 - 6 7 9 -9 0 9 0 &nbsp;            <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 &reg 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

Popular posts from this blog

java - Spring Data JPA: Why findOne(id) executing delete query internally? -

python - Mongodb How to add addtional information when aggregating? -

java - Incorrect order of records in M-M relationship in hibernate -