title: CSS media screen breakpoint
body: <p>I am using Bootstrap 4, but in the bootstrap framework have already media queries breakpoints, now where should I use CSS breakpoints selector class? I have used a selector class in the div class row side but it doesn't work. Here is my code :</p>
  
  <pre class="lang-css prettyprint-override"><code>@media(max-width: 992px){
      .section-4 .section-breakpoint{
        flex-wrap: wrap!important;
        justify-content: center!important;
      }
      .section-4 .section-breakpoint &gt; * {
        width: 100% !important;
      }
  }
  </code></pre>
  
  <pre class="lang-html prettyprint-override"><code>   &lt;section class="section-4"&gt;
          &lt;div class="container-fluid"&gt;
              &lt;div class="row section-breakpoint"&gt;
                  &lt;article class="col-md-5 article first-article"&gt;
                      &lt;hr class="hr-1"&gt;
                      &lt;h2&gt;&lt;i&gt;More tools to help&lt;br&gt;
                          you do more&lt;/i&gt;&lt;/h2&gt;
                      &lt;h4&gt;&lt;i&gt;Analytics, social, and productivity&lt;/i&gt;&lt;/h4&gt;
                      &lt;hr class="hr-2"&gt;
                      &lt;p&gt;Easy-to-understand analytics ensure you're able to see at a glance exactly how well your website is performing with all Gator Website Builder accounts. Simple social media tools allow you to add live feeds from Instagram, Twitter, and Facebook in order to stay engaged. You can add G Suite productivity tools to your domain, enabling Gmail, Docs, Slides, and more.&lt;/p&gt;
                      &lt;h5&gt;&lt;i&gt;&lt;b&gt;Get the best tools for $3.84/mo*&lt;/b&gt;&lt;/i&gt;&lt;/h5&gt;
                      &lt;a class="btn get-started-btn" href="#"&gt;BUY NOW&lt;/a&gt;
                  &lt;/article&gt;
                  &lt;div class="col-md-7 text-right"&gt;
                      &lt;img class="image-one" src="assets/images/product-7.png" alt="IMAGE-7"&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/section&gt;
  </code></pre>