Change the background colour of a row


I’m trying to change the background colour of a row. So the first row would have a white background. then the second row would have a light grey background and the third row would have an orange background.

When I try and change a rows background colour to grey, every row in the page turns to grey.

Any ideas on how to fix this?



To change the color of a row not bloc you have to make a custom class. Just highlight the row and type in a name for your custom class. Then bring up the class manager and click on the class you made. In the class manage click on the paintbrush icon and then change the background color to what ever you want.


@Pete Hi,

Check my tutorial on odd/even row.

thanks Casey

Hi Jakerlund,

great thanks for the tut video.

I’ve managed to change the row colour in blocs, but when I preview in the browser it doesn’t show the change.

Any ideas why this might be happening.



@Pete Are you using table rows in a HTML brick?
If so bootstrap.css gives them the light grey/white row colouring unless you override that with custom classes.

Hi Jakerlund,

no I’m using a single row block. I’ve made a custom class and then changed the background colour on there. the colour is changed within blocs app But when I preview in safari the background is white. I’ve attached a couple of grabs so you can see. thanks Peter


@Pete I can’t replicate your problem.
Could you PM me the bloc file so i can check it?
You can delete most stuff, just need to see those rows and classes.

Hi Jakerlund

can’t attach the project file as file attachment not allowed to be uploaded



Hi Pete, have you solved your problem? I have the same with the background of a bloc. Can change it via custom class in the application, but in the preview it is light grey/white.