MDB Free 4.3.x: “Hidden” And “Visible” Classes No Longer Work

Hi MDB Support,

I have updated to the most current free version of MDB, and while there's plenty to be excited about, it also seems like I have lost the toggle states of hiding and showing content with the Bootstrap "hidden" and "visible" classes, e.g., "hidden-lg visible-sm".

The page content is reproduced to offer different layouts for larger and smaller displays depending upon the viewport size and breakpoint. The top of this sample page is designed to serve the page content to larger displays while hiding the bottom half of the page with the same content. Similarly, the top half of the page would be hidden from smartphones and smaller displays.

My DIV containers include these classes as follows:

<!--Main layout--> <div class="container visible-lg visible-md hidden-sm hidden-xs"> <div class="row justify-content-center"> <div class="col-5"> <h6 class="small-lead">Project</h6> <p> <b>West Edge Sculpture Invitational</b> </p> <p> Sponsored and supported an event which allowed local sculptors the opportunity to display their work on Downtown Seattle streets during the summer months. </p> </div> <div class="col-3"> <img src="../images/projects/west-edge-sculpture-invitational.jpg" class="img-fluid" alt="" /> </div> </div> </div> <div class="container hidden-lg hidden-md visible-sm visible-xs"> <div class="row d-flex justify-content-center hidden-lg hidden-md visible-sm visible-xs"> <div class="col-8"> <h6 class="small-lead">Project</h6> <p> <b>West Edge Sculpture Invitational</b> </p> <p> Sponsored and supported an event which allowed local sculptors the opportunity to display their work on Downtown Seattle streets during the summer months. </p> <img src="../images/projects/west-edge-sculpture-invitational.jpg" class="img-fluid" alt="" /> </div> </div> </div> <!--/.Main layout-->

Please let me know what I'm missing.

Thanks!

Eric Seattle, WA

Add comment