creating a table

  • Author
    Posts
  • #129075

    colleenswat
    Member
    Original poster

    How can I create a table with 7 rows and 5 columns so that it’s responsive? Right now I’m using an image, but I think it’ll look better with html & css

    the page a need help with is colleenswat.com/atlas

    here is a screenshot of the table I’d like to create.
    https://snag.gy/3gzZ7o.jpg

    The blog I need help with is: colleenswat.com

    #129211

    colleenswat
    Member
    Original poster

    I was able to generate a table, but it is not responsive. It’s too large on mobile and table cells appear to be really long. Can you please look at the html.

    Thank you.

    #129216

    tarasdashkevych
    Theme Author

    Hi,

    You can use HTML to create tables: https://www.w3schools.com/html/html_tables.asp

    You can use the theme specific classes to change table styles. Please see “Table Example” section @ https://venturedemo.wordpress.com/typography/

    Also, the theme makes your table responsive by default. Please note, table element cannot behave the same way as div element in smaller screens, meaning you cannot break the columns in tables. Responsive tables allow tables to be scrolled horizontally.

    “It’s too large on mobile and table cells appear to be really long.”
    – You can use this custom CSS to set your table cells to auto width:

    @media screen and (max-width: 767px) {
        .table-responsive>.table>thead>tr>th,
        .table-responsive>.table>tbody>tr>th,
        .table-responsive>.table>tfoot>tr>th,
        .table-responsive>.table>thead>tr>td,
        .table-responsive>.table>tbody>tr>td,
        .table-responsive>.table>tfoot>tr>td {
            white-space: normal;
        }
    }

    Thank you,
    Taras

The topic ‘creating a table’ is closed to new replies.