Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • September 21, 2016 at 4:14 pm #689894
    meghanreed

    Hello!

    I just noticed an issue with tables. When I have the Table Purpose set to “Use the table to display tabular data” and the Responsive Styling set to “Make Entire Table Scrollable” the text does not wrap with the column width when the browser window is reduced. Any thoughts on how to resolve this?

    Thanks so much!

    September 23, 2016 at 3:25 pm #690824
    meghanreed

    Any thoughts on this?

    September 26, 2016 at 6:20 am #691475
    Ismael

    Hi,

    Thank you for using Enfold.

    That is the default style or behaviour of the table if you set the Responsive Styling to “scrollable”. It will not inherit the width of the parent container, in this case, the column.

    Best regards,
    Ismael

    September 29, 2016 at 3:56 pm #693188
    meghanreed

    I think there might be a misunderstanding of the issue. When the table is condensed even if I set the table to scroll able the columns still change sizes. When that happens the text does not wrap in the columns creating major display issues when viewing tables on mobile devices. See attached image.

    Any thoughts?

    October 3, 2016 at 4:32 am #694399
    Ismael

    Hi,

    I see. Please add this in the Quick CSS field:

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

    Best regards,
    Ismael

    October 5, 2016 at 11:06 am #695403
    2funky

    Hi,
    I think this is an known issue
    https://kriesi.at/support/topic/tabel-make-entire-table-scrollable-error-enfold-3-6-1/

    Regards Pete,

    October 7, 2016 at 2:37 pm #696517
    Yigit

    Hi,

    Following code should help

    @media only screen and (max-width: 768px) {
.avia_scrollable_table .avia-table {
    width: auto;
}}

    Best regards,
    Yigit

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.