Bootstrap Community, frontend Development

I have a page with 2 columns nested in another column. I am trying to hide one column at the sm breakpoint and have the other column go to 12. But when I resize the screen, the one column stacks instead of hiding. What am I doing wrong?

<div class="container-fluid h-100">

<div class="row h-100">

<div class="col-md-1"></div>

<div id class="col-sm-12 col-md-10 h-100">

<div class="row">

<div id="header" class="col-md-12">

<img class="img-fluid" src="images/if/mastheadLogo.jpg">

</div>

</div>

<div class="row">

<div id="menu" class="col-md-12">

<? include("menu.htm");?>

</div>

</div>

<div class="row h-100">

<div id="sidebar" class="col-md-2">

</div>

<div id="content" class="col-sm-12 col-md-10">

</div>

</div>

<div class="row">

<div class="col-md-12">

</div>

</div>

</div>

<div class="col-md-1"></div>

</div>

</div>

BackstageWebDesign () - 6 days ago - Reply 0