css - Fixed header position in bootstrap 3 modal -
i want use fixed header in bootstrap modal, if set .modal-header position:fixed scrolls along moda content. how create trully fixed header in bs modal?
instead of trying make header fixed, fix height of body , make scrollable. way header (and footer) visible.
you can using css3 vh unit calc
. both vh calc have pretty browser support (ie9+).
the vh unit relative viewport (= browser window) height. 1 vh
1% of height , 100vh
means 100% of viewport height.
we need substract height of modal's header, footer , margins. it's going difficult dynamic. if sizes fixed, add heights.
set either height
or max-height
calc(100vh - header+footer px)
.
.modal-body { max-height: calc(100vh - 210px); overflow-y: auto; }
Comments
Post a Comment