In the following code block bootstrap classes d-none d-md-block are cancelling d-flex. I need to not show this block on anything lower than md but also be able to set d-flex so that bootstraps align-self-end class works, (which currently it does not). How do I get these to play nicely together? Or is there another solution?

<div >                              
   <h2 >Title Here</h2>                       
</div>

CodePudding user response：

If I understand correctly, you shouldn't be using d-block at all. Replace it and d-flex with d-md-flex to apply flex display only to the medium breakpoint and above.

See https://getbootstrap.com/docs/5.1/utilities/flex/#enable-flex-behaviors and https://getbootstrap.com/docs/5.1/utilities/display/#hiding-elements.