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