Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add data attributes to tables #1207

Open
mjf opened this issue Jan 14, 2025 · 0 comments
Open

Add data attributes to tables #1207

mjf opened this issue Jan 14, 2025 · 0 comments

Comments

@mjf
Copy link

mjf commented Jan 14, 2025

Please add data attributes to all tables (everywhere where HTML tables are rendered, escpecially the <td> data attribute element (e.g., data-label="<column name>"). Responsive tables could then be fairly easy to implement using only CSS.

Simplest example
@media screen and (max-width: 800px) {
  table thead {
    visibility: hidden;
  }
  table tr,
  table td {
    display: block;
  }
  table td::before {
    content: attr(data-label)': '; /* Cool what we can do today! */
    float: left;
  }
}

I tested the above from space-style and it works, except that there is no data attribute to be used now, so the attribute hack has of course no effect. I'd really like to see this minor change implemented. It will make life on mobile easier.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant