Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • May 14, 2018 at 5:52 pm #956561
    pilepale

    Hello,
    I would like to apply a certain code only to certain tables and have applied the custom ID attribut to the div containing the certain table (“For Developers: Section ID” …. in this case the custom ID attribut is “ghwkurz” (without quotes).
    How to do this?

    This code does not work:

    @media screen and (max-width: 1420px)
    {
    div#ghwkurz table
    {
    .xxxxx { yyy:zzz;}
    .xxxxx { yyy:zzz;}
    .xxxxx { yyy:zzz;}
    }
    }

    Thanks for help,

    best regards

    Mario

    • This topic was modified 6 years, 9 months ago by pilepale.
    May 14, 2018 at 6:00 pm #956573
    Jordan Shannon

    Hey pilepale,

    Please provide a link to the site so we can see the table for ourselves. The table has a custom id right? Or does the div the table is in have the custom id?

    Best regards,
    Jordan Shannon

    May 14, 2018 at 6:19 pm #956592
    pilepale

    Hi Jordan,
    the div the table is in have the custom id – -> ghwkurz
    The table has no custom id.

    May 14, 2018 at 6:36 pm #956593
    Jordan Shannon

    Hi,

    It looks like your css was formed incorrectly:

    @media screen and (max-width: 1420px){
div#ghwkurz table{
attribute:style;
attribute:style;
attribute:style;
}}

    Best regards,
    Jordan Shannon

    May 14, 2018 at 6:55 pm #956607
    pilepale

    This is the code i will apply to table in div#ghwkurz by use @media screen and (max-width: 1420px)

    How to do this?

    .responsive .avia_scrollable_table {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    }

    .avia_scrollable_table .avia-table {
    width: auto;
    }

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

    May 14, 2018 at 7:26 pm #956617
    Jordan Shannon

    Hi,

    You would use this:

    @media screen and (max-width: 1420px){
#ghwkurz .avia_scrollable_table {
width: 100%;
overflow-x: auto;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: -ms-autohiding-scrollbar;
}

#ghwkurz .avia_scrollable_table .avia-table {
width: auto;
}

.responsive #ghwkurz .avia_scrollable_table .avia-data-table > thead > tr > th,
.responsive #ghwkurz .avia_scrollable_table .avia-data-table > tbody > tr > th,
.responsive #ghwkurz .avia_scrollable_table .avia-data-table > tfoot > tr > th,
.responsive #ghwkurz .avia_scrollable_table .avia-data-table > thead > tr > td,
.responsive #ghwkurz .avia_scrollable_table .avia-data-table > tbody > tr > td,
.responsive #ghwkurz .avia_scrollable_table .avia-data-table > tfoot > tr > td {
white-space: nowrap;
}}

    Best regards,
    Jordan Shannon

    May 14, 2018 at 7:31 pm #956621
    pilepale

    Thank you very much, i´l try this

    best regards

    May 14, 2018 at 7:49 pm #956632
    Jordan Shannon

    Hi,

    Great! Please let us know the result.

    Best regards,
    Jordan Shannon

    May 14, 2018 at 7:51 pm #956634
    pilepale

    It works great !!
    Thank you!

    May 14, 2018 at 8:08 pm #956649
    Jordan Shannon

    Hi,

    Great! I’m glad I was able to help you. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘Assign @Media query to a specific div’ is closed to new replies.