Other than buttons, we also have to apply the proper Bootstrap styles to our <table> elements:

<h3>Questions</h3>
<div *ngIf="questions.length > 0">
    <div class="table-responsive">
        <table class="table table-hover questions">

[...]

Here we added the .table and .table-hover classes to the <table> element, and also wrapped it up within a new <div class="table-responsive"> element: the classes will affect the table look and feel, while the container element--as the name implies --will give responsive features to our table; more specifically, the table will scroll horizontally on small devices (under 768 px) if there's no way to resize its contents within the browser's viewport.

The Bootstrap default table requires little or no styling: however since our Bootstrap template hides the <th> borders by default, it's not a bad idea to restore them to improve their readability. We can do that with a simple CSS rule:

.table thead  tr  th {
    border-bottom: 2px solid #ecf0f1;
}

No need to use LESS for this, unless we don't want to apply more custom rules on these tables.