How can I make outside border of table different in html?

Question

I am trying to achieve this exact table: Table wanted

I have written this code in css stylesheet here:

table{
    width:90%;
    height:100%;
    margin-left:auto;
    margin-right:auto;
    background-color: white;
    color:#654321;
    border-collapse: collapse   ;
    border-style:outset;
    border-width:px;
    position: relative;
    font-size:20px;
    font-family:DTCRoughM11,arial;

}
tr,th,td{
    padding:5px;
    border-width: 5px;
    border-style:inset;
    border-collapse:separate;   
}

I am getting a result like this: Table i got

Basically, what I wanted to do is set outside border wider than inside borders with an inset border-style.

How Can I achieve that?

Answer 1

I think you have a typo. This line doesn't make sense:

 border-width:px;

Based on the screenshot, I think you probably want that to be maybe:

 border-width:3px;

Answer 2

Have you tried setting a width on the border-width property of the table? In the code you have provided, there is no width defined...

border-width: 10px; for example.