title: I have scroller bar is not working properly
body: <p>I have a comment section on my page, And I add a scroller for comments. If in the comments section there are no comments then I want to hide the scroller bar. In my CSS I give   <code>overflow: auto;</code> but still it shows scroller bar when there are no comments.</p>
  
  <p>CSS:</p>
  
  <pre><code>&lt;style&gt;
      .scrollbar
               {
                  margin-left: 30px;
                  float: left;
                  height: 300px;
                  width: 100%;
                  margin-bottom: 25px;
                  overflow: auto;
               }
  
               .force-overflow
               {
                  min-height: 450px;
               }
               #style-6::-webkit-scrollbar-track
               {
                  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
                   background-color: #F5F5F5;
               }
               #style-6::-webkit-scrollbar
               {
                  width: 10px;
                  background-color: #F5F5F5;
               }
  
               #style-6::-webkit-scrollbar-thumb
               {
                  background-color: #F90; 
                  background-image: -webkit-linear-gradient(45deg,
                  rgba(255, 255, 255, .2) 25%,
                  transparent 25%,
                  transparent 50%,
                  rgba(255, 255, 255, .2) 50%,
                  rgba(255, 255, 255, .2) 75%,
                  transparent 75%,
                  transparent)
                }
  &lt;/style&gt;
  </code></pre>
  
  <p>Code:</p>
  
  <pre><code>&lt;div class="scrollbar" id="style-6"&gt;
                 &lt;div style=" height:270px;" class="force-overflow"&gt;
                    &lt;?php foreach ($userComments as $comment):?&gt; 
                    &lt;div class="post-details-wrapper"&gt;
                       &lt;?php 
                          $postdate =strtotime($comment['timestamp']);
                          $now = time();
                          ?&gt;
                       &lt;div class="col-sm-12"&gt;
                          &lt;p&gt;
                             &lt;img style="height: 45px;width: 48px;border-radius:50%;" src="&lt;?php echo base_url();echo $comment['thumb_url']?&gt;" /&gt;
                             &amp;nbsp;
                             &lt;b style="padding-right:6px;padding-left:6px;border-radius:25px;background-color:#888888;color:white;font-family:Roboto, Arial, sans-serif;font-weight:500;&gt;"&gt;&lt;?php echo $comment['username'];?&gt;&lt;/b&gt;
                             &amp;nbsp;&lt;?php echo date('d-m-Y',$postdate);?&gt;
                          &lt;/p&gt;
                       &lt;/div&gt;
                       &lt;div class="col-sm-12"&gt;
                          &amp;nbsp;&amp;nbsp;
                          &lt;p style="font-size:15px;"&gt;&lt;?php echo $comment['comment']?&gt;&lt;/p&gt;
                       &lt;/div&gt;
                    &lt;/div&gt;
                    &lt;?php endforeach;?&gt;
                 &lt;/div&gt;
               &lt;/div&gt;
  </code></pre>
  
  <p>In the bellow image, you can see the scroller bar present when no comments.
  <a href="https://i.stack.imgur.com/ttFOK.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ttFOK.jpg" alt="enter image description here"></a></p>