How To Style Rows and Cells in a Table?

Dynamic Table element in Max Addons for Bricks Builder not only helps you create functional tables but also gives you complete control over their design.

Two key areas you'll often want to customize are the rows and cells, which directly impact readability and the overall look of your table.

In this doc, we'll walk through how to style table rows and cells step by step.

---

Style Rows and Cells in a Table#

Step 1: Add the Dynamic Table Element#

1. Open a page or create a new one in Bricks Builder.
2. Search for 'dynamic table' in the Elements panel and add it to your page.
3. A basic table layout will appear, which you can style.

Step 2: Style Table Rows#

1. Select the table element.
2. In the sidebar, go to the Content tab.
3. Locate and expand the ROWS STYLE section.

Here you'll find:

• Striped Rows: Enable this option to apply alternating styles for odd and even rows. This improves readability, especially in tables with a lot of data.
• Odd & Even Rows Styling: Once striped rows are enabled, you can set unique styles for odd and even rows:

  • Background Color: Apply alternating background shades.
  • Text Color: Choose different text colors for better contrast.
  • Border: Add or customize borders around each row.

Step 3: Style Table Cells#

1. Still under the Content tab, scroll down to the CELLS STYLE section.
2. Expand it to reveal customization options.

Here you can adjust:

• Padding: Control the inner spacing within each cell so text isn't cramped.
• Typography: Customize font family, size, weight, line height, and alignment for the cell content.
• Background Color: Set a consistent background for all table cells.
• Border: Add or edit borders to separate cell content more clearly.

---

That's it! With the Rows Style and Cells Style options, you can transform your Dynamic Table into an interactive and highly readable data display.