Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Zebra styles broken on Data Table component

See original GitHub issue

Zebra styles aren't working on specific types of the data table component; with batch expansion, with dynamic content, with expansion.

What package(s) are you using?

carbon-components
carbon-components-react

Detailed description

When selecting zebra styles on the above listed data table types, the background to every row becomes white.

Is this issue related to a specific component?

Data Table

What browser are you working in?

Chrome

What version of the Carbon Design System are you using?

10.7.4

Step 1: Select either “with batch expansion”, or “with dynamic content” or “with expansion” Step 2: Under Knobs, select “with zebra styles”

You’ll see the rows aren’t acting as intended, please let me know if you guys need any more info

Issue Analytics

State:
Created 3 years ago
Comments:7 (5 by maintainers)

Top GitHub Comments

1reaction

emyarodcommented, Apr 14, 2020

1reaction

andysherman2121commented, Apr 14, 2020

Hey @joshblack Sure, will do! I added the steps to reproduce in the initial comment, let me know if you need any more info

Top Results From Across the Web

rich:datatable -- zebra striping with rowClasses attribute does ...

I am trying to style a table with "zebra" coloured rows, however, for some reason, the rowClasses attribute does not seem to work...

data table component - Carbon Design System

The data table features a zebra stripes modifier that styles the table rows with alternating colors to make scanning horizontal information easier for...

Lightning Component - Data Tables Styling Issue

I am creating a lightning component and I'm trying to style the data table using the example in the Lightning Design System documentation....

Data table component - Vuetify

Using the dense prop you are able to give your data tables an alternate style.

Bootstrap Tables - examples & tutorial

Lots of responsive table usage & styling examples like bordered, striped, small, ... Tables allow you to aggregate a huge amount of data...