Hi, I've recently tried putting panels inside of each other (with bootstrap-3.0.0-rc1) and the result is not pretty. The border-color matches the style of the associated panel color, but the panel-header background-color does not match, it simply uses the background-color of the top-most panel. My fix for this was simply to change:
.panel-success .panel-heading
to
.panel-success > .panel-heading
and similar changes for .panel-danger, .panel-warning, and panel-info.
Regards,
Andrew Robbins
P.S. The markup I used was roughly:
<div class="panel panel-success">
<div class="panel-heading">
<h2 class="panel-title">You did it!</h2>
</div>
<p>You should be proud.</p>
<p>Next time, you can do it again!</p>
<div class="panel panel-warning">
<div class="panel-heading">
<h2 class="panel-title">However,</h2>
</div>
<p>You should be careful about doing it too quickly...</p>
<p>Because...</p>
<div class="panel panel-danger">
<div class="panel-heading">
<h2 class="panel-title">Things happen!</h2>
</div>
<p>... you never know what might happen.</p>
<p>Unexpected events are part of life.</p>
</div>
</div>
</div>
P.P.S. Expected results attached.
--
You received this message because you are subscribed to the Google Groups
"twitter-bootstrap" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
For more options, visit https://groups.google.com/groups/opt_out.
<<attachment: expected.png>>
