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; } 

see jsfiddle


Comments

Popular posts from this blog

python - Subclassed QStyledItemDelegate ignores Stylesheet -

java - HttpClient 3.1 Connection pooling vs HttpClient 4.3.2 -

SQL: Divide the sum of values in one table with the count of rows in another -