twitter bootstrap - Panel Heading not displaying correctly -


i new-ish twitter bootstrap, , trying have panel, within panel.

the first outer panel fine, inner 1 - header seems cut off edges. here's screenshot of what's happening:

strange headers

and here's code attempted use:

<div class="panel panel-default">     <div class="panel-heading">         <h4>@string.format("{0} {1} - {2}", model.institution, model.description, model.accounttype)</h4>     </div>     <div class="panel-body">         <br />         <div class="col-md-4 panel panel-default">             <div class="panel-heading">                 <h3>account details</h3>             </div>              <div class="panel-body">                 <div class="row">                     <div class="">                         <small>                             @html.labelfor(x => x.institution)</small>                         <br />@model.institution<br />                     </div>                 </div> 

can see why losing edges?

you have wrap panel .col-md-4 , place inside .row

<div class="panel panel-default">   <div class="panel-heading">     <h3 class="panel-title">panel title</h3>   </div>   <div class="panel-body">       <div class="row">       <div class="col-md-4">         <div class="panel panel-default">           <div class="panel-heading">             <h3 class="panel-title">panel title</h3>           </div>           <div class="panel-body">             panel content           </div>         </div>       </div>     </div>     </div> </div> 

Comments

Popular posts from this blog

java - Intellij Synchronizing output directories .. -

git - Initial Commit: "fatal: could not create leading directories of ..." -