Content in tables is overlapping with adjacent columns

  • Author
  • #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.

    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


    Theme Author

    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;



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

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