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:
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
Post a Comment