Content in tables is overlapping with adjacent columns

  • Author
    Posts
  • #150951

    A visitor to our website pointed out an issue with one of our pages.
    I am using the Table Block in our Anemone Theme to present some info.
    https://nerm2020.org/full-technical-program/

    Viewing the page on a normal monitor looks fine.
    Viewing the page on a mobile phone in portrait orientation results in the text from the first column overlapping the text from the second column.
    This problem is not evident when the phone is in landscape mode.

    How can I fix this?

    The blog I need help with is nerm2020.org.

    #150957

    designorbital
    Theme Author

    Hi,
    Please try the following CSS Snippet.

    
    .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;
    }
    

    Thanks

    #151092

    Wonderful! This worked perfectly. Thank you so much. :-)

The topic ‘Content in tables is overlapping with adjacent columns’ is closed to new replies.