Tagged: 

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #387349

    I am using the page builder to create a page, and am having an issue with the table element.

    The table headers exist, and have text in them. In the past, on narrower screens, that text used to be applied to every cell in that column, using the :before pseudo-element.

    However, I am now experiencing a bug with that functionality. The text does not apply on most of the columns; and on the two that it does, it does so incorrectly. I have included a link to a live page where this issue is present.

    I’d appreciate your help in determining how to fix this.

    Update:
    I had a <small> element in one of the header columns. I removed that, and now all but one of the cells contain a header — but they are still incorrect. They are all offset by one; the issue is that the script you guys have performing this action is taking the first column’s header and starting to use that in column #2.

    View the page; you’ll see what I mean.

    • This topic was modified 4 years, 5 months ago by  Redfrex.
    #387990

    Hi Redfrex!

    With how your using the table I think what your wanting to do is open up /enfold/config-templatebuilder/avia-shortcodes/table.php and change line 294 from this.

    $responsive_style .= ".avia-table-".self::$table_count." td:nth-of-type(".($counter + 1)."):before { content: '".$row['content'][$counter]['content']."'; } ";
    

    To this.

    $responsive_style .= ".avia-table-".self::$table_count." td:before { content: '".$row['content'][$counter]['content']."'; } ";
    

    Best regards,
    Elliott

    • This reply was modified 4 years, 5 months ago by  Elliott.
    #401260

    Hey Elliott,

    Thanks for the reply. Unfortunately, your supplied code didn’t work – it instead replicated the third heading throughout the table when the mobile media query activated. Changing line 294 to the following did fix my issue, however:

    $responsive_style .= ".avia-table-".self::$table_count." td:nth-of-type(".($counter + 1)."):before { content: '".$row['content'][$counter + 1]['content']."'; } ";

    • This reply was modified 4 years, 4 months ago by  Redfrex.
    #401755

    Hi!

    Alrighty, thanks for posting your solution.

    Cheers!
    Elliott

    #423170

    Just removing the +1 does also work. Change:

    $responsive_style .= ".avia-table-".self::$table_count." td:nth-of-type(".($counter + 1)."):before { content: '".$row['content'][$counter]['content']."'; } ";

    To:

    $responsive_style .= ".avia-table-".self::$table_count." td:nth-of-type(".($counter)."):before { content: '".$row['content'][$counter]['content']."'; } ";

    Several versions ago, the above was actually the original line. But for some reason the +1 was added.

    With each update (for several months now) I’m hoping that Kriesi has removed the +1, because all it seems to be doing is cause a problem with responsive tables. Yet no luck so far.

    Since this forces me to use a custom table.php file (without the +1) within the child theme, a new problem has recently been introduced: (Purchase code hidden if logged out) /#post-422966″>https://kriesi.at/support/topic/ (Purchase code hidden if logged out) /

    I hope Kriesi looks into the table code / +1, because it keeps causing problems.

    Anyway, I’ll keep hoping :)

    Best,

    Ralph

    PS: How can I add those nice code blocks to my posts?

Viewing 5 posts - 1 through 5 (of 5 total)

The topic ‘[BUG] Table headers applied incorrectly on media query.’ is closed to new replies.