• Register
    • Help

    striker  0 Items
    Currently Supporting
    • Home
    • News
    • Forum
    • Wiki
    • Support
      • Manage Subscriptions
      • FAQ
      • Support For
        • VaultWiki 4.x Series
        • VaultWiki.org Site
    • What's New?
    • Buy Now
    • Manual
    • 
    • Support
    • VaultWiki 4.x Series
    • Feature
    • Table bbcode and narrow/small viewport improvements (overflow-x:auto & sticky header row)

    1. Welcome to VaultWiki.org, home of the wiki add-on for vBulletin and XenForo!

      VaultWiki allows your existing forum users to collaborate on creating and managing a site's content pages. VaultWiki is a fully-featured and fully-supported wiki solution for vBulletin and XenForo.

      The VaultWiki Team encourages you to join our community of forum administrators and check out VaultWiki for yourself.

    Issue: Table bbcode and narrow/small viewport improvements (overflow-x:auto & sticky header row)

    • Issue Tools
      • View Changes
    1. issueid=5170 July 12, 2017 6:03 PM
      ACL ACL is offline
      Regular Member
      Table bbcode and narrow/small viewport improvements (overflow-x:auto & sticky header row)

      Would it be possible to look at adding some additional functionality to the tables bbcode so that table data displays better on small/narrow screens? At least

      At the minimum it would be nice to have a containing block element with "overflow-x:auto" css applied to make wide tables scrollable left/right when they don't fit into available space for a given vw-section. While I could wrap every problem table with the div bbcode and achieve the horizontal-scroll behaviour manually I think it would be neater if this was integrated into the table bbcode handling directly.

      ----

      A further change to table parsing (but IMO low priority) would an optional sticky first row for vertical scrolling when the table height is greater than the viewport and an appropriate table bbcode attribute is defined such as stickyheader="row". Maybe this can be achieved by placing the first row into a thead block and making the tbody element scrollable (CSS only, no javascript) .. I'm not sure on the best implementation.

      An even lower priority would be to have a stickyheader="col" (column) option to fix/stick the first column when horizontal scrolling. As in, a table could have either a sticky first row or a sticky first column depending on the value of the optional stickyheader attribute (or whatever you decide to call it).

      Personally I'd be happy with just horizontally scrollable tables possibly with a sticky row and don't bother about a sticky column which would make implementation simpler I think.
    Issue Details
    Issue Number 5170
    Issue Type Feature
    Project VaultWiki 4.x Series
    Category BB-Code Parsing
    Status Implemented
    Priority 7 - Minor Features / Enhancements
    Suggested Version 4.0.18
    Implemented Version 4.1.0 RC 2
    Milestone (none)
    Software DependencyAny
    License TypePaid
    Votes for this feature 1
    Votes against this feature 0
    Attachments 0
    Assigned Users (none)
    Tags (none)




    1. February 21, 2020 7:33 PM
      pegasus pegasus is offline
      VaultWiki Team
      The first part has been handled separately per: https://www.vaultwiki.org/issues/5920/

      As for sticky headers/columns, this has been added in the next release by:
      - adding the "sticky" attribute to the table, with a value of "row", "col", or "both"; OR
      - manually applying the vw-table-sticky class to the table, AND: vw-table-sticky-row to desired rows, and/or vw-table-sticky-col to all cells in the desired column.

      In order for sticky headers/columns to work inside the overflow-x parent, we have to set a fixed height on the table. This defaults to max-height: 100vh (which is the viewport size), but can be customized via your table's style attribute.
      Reply Reply  
    + Reply

    Assigned Users
    Loading Please Wait
    Tags
    Loading Please Wait
    • Contact Us
    • License Agreement
    • Privacy
    • Terms
    • Top
    All times are GMT -4. The time now is 8:13 AM.
    This site uses cookies to help personalize content, to tailor your experience, and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Learn more… Accept Remind me later
  • striker
    Powered by vBulletin® Version 4.2.5 Beta 2
    Copyright © 2025 vBulletin Solutions Inc. All rights reserved.
    Search Engine Optimisation provided by DragonByte SEO (Pro) - vBulletin Mods & Addons Copyright © 2025 DragonByte Technologies Ltd.
    Copyright © 2008 - 2024 VaultWiki Team, Cracked Egg Studios, LLC.