How to fixed a table header left section and right section scroll only middle section

[FoB]

HI i m searching in the result but i have not found any result I want to a simple table and now i have three question [*]is How to fixed of a header (Bold Text area)[*]how to fixed left section (1 type text area)[*]how to fixed right section (7 type text are )HTML\[code\] <div class="m-m"><table class="demo-table"> <tr> <td>fixed area</td> <td>fixed area</td> <td>fixed area</td> <td>fixed area</td> <td>fixed area</td> <td>fixed area</td> <td>fixed area</td> </tr> <tr> <td>fixed area</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>fixed area</td> </tr> <tr> <td>fixed area</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>fixed area</td> </tr><tr> <td>fixed area</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>fixed area</td> </tr><tr> <td>fixed area</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>fixed area</td> </tr><tr> <td>fixed area</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>fixed area</td> </tr><tr> <td>fixed area</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>fixed area</td> </tr><tr> <td>fixed area</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>fixed area</td> </tr><tr> <td>fixed area</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>fixed area</td> </tr><tr> <td>fixed area</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>fixed area</td> </tr></table></div>\[/code\]Css\[code\]table { border-collapse: collapse; border-spacing: 0;}.m-m{width:200px;height:200px;margin:0 auto;overflow:scroll;}.demo-table{border:solid 1px red;width:100%;}.demo-table tr:first-child td{font-weight:bold;}.demo-table tr td{border:solid 2px green;padding:5px;}\[/code\]Thanks