title: Scroll bar not appearing in html table
body: <p>I searched for similar question and found some but the answers did not help. So I am posting it. Below is the code. When i have lot of records the scroll bar is not shown.</p>
  
  <p>What am I doing wrong?</p>
  
  <p>Adding the CSS also</p>
  
  <pre><code>.content-cardnumber
  {
      margin-left: auto;
      color:rgba(47,130,194,.8);
      width:200px;
      text-align:center;
  }
  .content-origintime
  {
      margin-left: 110px;
      color:rgba(47,130,194,.8);
      text-align:center;
  }
  .content-eventcode
  {
      margin-left: 130px;
      color:rgba(47,130,194,.8);
      text-align:center;
      width:200px;
  }
  .content-readername
  {
      margin-left: 150px;
      color:rgba(47,130,194,.8);
      text-align:center;
  }
  .events-table
  {
      background-color:#aacef6;
      overflow:auto;
  }
  &lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;List of Alarms&lt;/title&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;h2&gt;View&lt;/h2&gt;
          &lt;div style="overflow-y:auto"&gt;
              &lt;table class="events-table" style="overflow-y:auto"&gt;
                  &lt;tr&gt;
                      &lt;th class="content-cardnumber"&gt;Card Number&lt;/th&gt;
                      &lt;th class="content-eventcode"&gt;Event Code&lt;/th&gt;
                      &lt;th class="content-origintime"&gt;Event Time&lt;/th&gt;            
                  &lt;/tr&gt;
  
                  @foreach (IEvent e in Model.EventList)
                  {
                      &lt;tr&gt;
                          &lt;td class="content-cardnumber"&gt;@e.CardNumber&lt;/td&gt;
                          &lt;td class="content-eventcode"&gt;@e.EventCode&lt;/td&gt;
                          &lt;td class="content-origintime"&gt;@e.EventOriginTime&lt;/td&gt;
  
                      &lt;/tr&gt;
                  }
  
              &lt;/table&gt;
          &lt;/div&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>