Can anyone help please, I am trying to make a table responsive so looks good on mobile view, at present the user has to scroll across the table to see the rest of the content

I am using couchcms and repeatable regions so the admin can add/edit table content. I was thinking of using the following tutorial https://css-tricks.com/responsive-data-tables/ but don't work as well as I thought it might.

The current code I have is below

Code: Select all
<div class="table-responsive">
                    <table class="table table-bordered">
                        <!-- Table Head Start -->
                        <tr class="headerbg">
                            <th>Quality Class</th>
                            <th>Typical examples</th>
                        <!-- Table Head End -->
                        <cms:show_repeatable 'secondsection_table'>
                                <td><cms:show first_column_content /></td>
                                <td><cms:show second_column_content /></td>

UPDATE: Sorry sorted it now and got it working