Using Display:none when using bootstrap 4

Hi,

I am working on a site using bootstrap v4 beta. Previously if I wanted to hide an element on bigger screens I would do this in the CSS file and do something like:

@media (min-width: 576px) {

 #mobileonlysection{ 
  display:none; (or maybe visibility:hidden;)

 }

}

Select allOpen in new window

However, that's working not so great at the moment. Is it the case that this is no longer supported by bootstrap and I should be using the line

 

<section id="mobileonlysection">
		 <div class="container d-md-none"> <!-- displays none on medium and up--> 
		 	  <div class="row>....etc

Select allOpen in new window

The does seem to work but it leaves a white line between elements relating to the padding or margin from mobileonlysection in the medium screens and up. Made me wonder if there is a better way to do this? Is there?

Thanks,

Adam