CSS table right margin in scrollable div

Question

I have div with \"overflow: scroll\" and fixed-size table inside.
I need to add empty space below and on the right of the table.
I\'m using following code, however i

Answer 1

The div, haven't the correct width. Adding 120px (20px to margin), and resizing the table to 100px this work.

CSS:

  div{
    display: inline-block;
    width: 120px; /* Updated*/
    height: 120px; /* Updated*/
    background: blue;
    overflow: scroll;
  }
  table{
    table-layout: fixed;
    background: red;
    margin-bottom: 20px; 
    margin-right: 20px; 
    width: 100px; /* added */
  }
  td{
    min-width: 150px;
    max-width: 150px;

  }

Demo