Creating Rules in Blocs

I Need Help
#1

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.

50
Screenshot 2020-01-17 at 11.40.50.png799×413 122 KB

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:

#2

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

1 Like
#3

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

#4

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

#5

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!

#6

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

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

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:

#8

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.

#9

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!