Add a Horizontal Line Above the Title in An Image Poster Block | Squarespace Rally Template

This quick code will add a horizontal line above the title on a poster block .You can increase or decrease the width to extend or shrink the line. You can also adjust the height and color. You can view it live at sustainableproject.org.

Screen Shot 2018-04-30 at 9.12.35 PM.png

.sqs-block-image .design-layout-poster.image-block-outer-wrapper.image-block-v2 .image-title p:before
{content:""; 
background: #abbc5e; 
display: block; 
position: relative;
top: -25px;
left: 45%;
height: 2px; 
width: 10%;}

 

Also pictured in this example:

Add A Text Background Color for Image Poster Block

.sqs-block-image .design-layout-poster.image-block-outer-wrapper.image-block-v2 .image-card
{background-color: #fafafa;
padding: 8% 3% 3% 3%;
margin-top: 80px;}