Responsive scroll

  • Resolved degebe

    (@degebe)


    5 years, 10 months ago

    Hello Tobias,
    I have installed Responsive Tables plug in and I wanted to use scroll mode so I put [table id=2 responsive=scroll /] but when I see it on a mobile, some text appear like “preview” “deleted item” “product” (this text is no present in the table) and the content of the table is not showing properly.
    I add this code to “Custom CSS”
    .tablepress thead th,
    .tablepress tfoot th {
    background-color: #ffffff;
    }

    .tablepress-id-2 tbody td {
    font-family: Tahoma;
    font-size: 16px;
    color: #000000;
    text-align: center;
    }

    .tablepress .odd td {
    background-color: #c6ccd3;
    }

    .tablepress .even td {
    background-color: #ebf0f5;
    }

    .tablepress-id-2 .row-2 td {
    background-color: #f2bd03;
    }

    .tablepress-id-2 .row-1 .column-1 {
    background-color: #000000;
    color: #ffffff;
    text-align: center;
    width: 150px;
    }

    .tablepress-id-2 .row-1 .column-7 {
    background-color: #000000;
    color: #ffffff;
    text-align: center;
    }

    .tablepress-id-2 .row-3 td {
    background-color: #a1a5aa;
    font-weight: bold;
    }

    .tablepress {
    word-break: normal;
    }

    I imported the table from a CSV file
    Is it possible that would have any conflict with the “Industrial” theme I am using?

    Thank you in advance.

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    thanks for your question, and sorry for the trouble.

    To fix this issue, please extend that last block of CSS code to

    .tablepress {
	word-break: normal;
	table-layout: auto;
}

    Regards,
    Tobias

    Thread Starter degebe

    (@degebe)

    Thanks Tobias, The responsive issue was fixed after I added the line you told me.
    But the additional texts are still showing: “preview” “deleted item” “product” (those texts are not present in the table on desktop view). How can I remove those texts?
    Another question: Is it posibble to make visible vertical lines? I tried via CSS but I had no success.

    Thank you!
    DEGEBE

    • This reply was modified 5 years, 10 months ago by degebe.
    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    these extra texts are added by your theme, via the CSS code in https://www.accesorioszaloze.com/wp/wp-content/themes/industrial/assets/css/responsive.css
    You should ask the theme developers for a reason for that and how to remove it.

    To add a border, you can use

    .tablepress-id-2 tbody td {
  border-left: 1px solid #333333;
}

    Regards,
    Tobias

    Thread Starter degebe

    (@degebe)

    Thank you Tobias! I could fix all!

    • This reply was modified 5 years, 10 months ago by degebe.
    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    no problem, you are very welcome! ?? Good to hear that this helped!

    Best wishes,
    Tobias

    P.S.: In case you haven’t, please rate TablePress here in the plugin directory. Thanks!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Responsive scroll’ is closed to new replies.

Tags