html - How to fit inner div inside an outer div -
html:
<div style="width: 300px; position: absolute; right: 25%; top: 5%; -webkit-box-shadow: 2px 4px 40px 0px rgba(0,0,0,0.75); -moz-box-shadow: 2px 4px 40px 0px rgba(0,0,0,0.75);box-shadow: 2px 4px 40px 0px rgba(0,0,0,0.75);"> <section class="notif notif-warn"> <h6 class="notif-title">warning!</h6> <p>this task forced checked out user. changes not saved site.master.</p> <div class="notif-controls"> <a href="#" class="notif-close" id="cbtn">close</a> </div> </section> </div>
jsfiddle: http://jsfiddle.net/sikni8/kb2r6d4c/1/
how can update css ensure inner div fits within outer div box shadow.
you can add box-sizing: border-box;
.notif
class or remove 100% width.
the problem when add 100% width + padding element cause overflow.
Comments
Post a Comment