html - Mixing bootstrap with a non-responsive div contents? -
my boss has asked me update portion of our website using bootstrap, header. using static navbar our header, , rest of page mess of table soup (i think site written 10 years ago). way code structured right this:
<div class="container"> < code navbar ></code navbar> <table> <content of website> </table> </div>
it looks great on desktop on mobile falls apart , zooms top left corner of website. cannot see of header or 65% of webpage. using:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
rewriting page in bootstrap not option, re-use header across @ least 165 different html files. guess asking possible take non-responsive part of webpage, slap responsive element zooms-out contents based on screen size?
cheers!
your route of least resistance wrap table in <div class="table-responsive"></div>
, like:
<div class="container"> < code navbar ></code navbar> <div class="table-responsive"> <table> <content of website> </table> </div> </div>
this make table scroll on mobile. see docs here
Comments
Post a Comment