Creating Rules in Blocs

Hi. I’m look for some help and advice.

I’m currently redeveloping a site for a client in Blocs v3.4.3, that was originally built using a bought Adobe Muse template. The responsive page design features rules between headings and paragraphs, that are a specific size and don’t change.

I really don’t want to create these rules as graphics and then import them as images. I’m looking for a way to generate these within the app itself. So what is the best technique for me to use in Blocs to do this? Should I use the Divider bric and then set up a class for it, and can I specify height and width for the divider? Or is there a smarter trick that I’ve missed?

Thanks in advance for any suggestions :slight_smile:

I’d give the Title text a class, add some padding to the bottom and apply a border to the bottom edge.

1 Like

Cool :sunglasses: Thanks for that @Norm I’ll give it a whirl! :+1:

Or add a divider (hr) and apply a custom class to it.

Yes, that’s what I thought. I’m just finding the styling of the divider a bit unintuitive. I’ll continue to explore more here. Thanks!

I’m not on my Mac, but will be something like this.

hr.redline {
  border-top: 2px solid red;
  max-width: 50px;

Yeap! I know how to style CSS. I just don’t know how to access the CSS file in Blocs. I’m going to leave it until Monday. Look at it again with a fresh pair of eyes! :eyes:

Sorry I mis-read your post.

I had a quick look at the HTML and Blocs uses a class called divider.

I tested it, adding .divider to the class manager allows you to modify the divider.

Hi. And thanks again.

For some reason my Blocs file appears to have become corrupt. It started to misbehave with also sorts of things on Saturday. So I decided to save the file with a new name today, and that appears to have resolved many issues, including the ability to style the divider.

All is good here now, so happy days!