Add Line Below Gallery on Flatiron

Is it possible to add a Line below Gallery images on Flatiron? I would like to add a Line between the Gallery and the Index Grid that displays below to visually separate the two. Is there custom CSS or HTML that would accomplish this goal?

You can see a sample page here: https://www.piccadilley.com/#/environmental-portraits/

Could it be as simple as adding a line from the plus menu and dragging it where you want it?  I've done it on my site at various spots on my gallery page.  Thoughts? 

www.bryantcoffey.com/work

B

Try

.sqs-gallery-container.sqs-gallery-block-slideshow {
    border-bottom: 1px solid #000;
    padding-bottom: 10px;
}

Then tweak the line thickness, style and colour as well as the padding. 

Options for visible border line styles are:

• dotted
• dashed
• solid
• double
• groove - 3D grooved border
• ridge - 3D ridged border
• inset - 3D inset border
• outset -  3D outset border

If this resolves your problem, please hit like and also vote it up.

On 10/8/2019 at 12:18 AM, bcoffey said:

Could it be as simple as adding a line from the plus menu and dragging it where you want it?  I've done it on my site at various spots on my gallery page.  Thoughts? 

www.bryantcoffey.com/work

B

Thank you, Bryant! For Pages that would definitely work, but I'm looking to add to either Galleries or implement the change using Site Styles, I haven't seen a way to add a Line using the cms tool in those areas. Do you know if that's possible?

On 10/8/2019 at 12:57 AM, colin.irwin said:

Try

.sqs-gallery-container.sqs-gallery-block-slideshow {
    border-bottom: 1px solid #000;
    padding-bottom: 10px;
}

Then tweak the line thickness, style and colour as well as the padding. 

 

Options for visible border line styles are:

• dotted
• dashed
• solid
• double
• groove - 3D grooved border
• ridge - 3D ridged border
• inset - 3D inset border
• outset -  3D outset border

If this resolves your problem, please hit like and also vote it up.

Thank you so much, Colin! Tried the CSS but it didn't produce a result on the site.

How about...

#project {
  
  border-bottom: solid;
  
  }

#project .gallery {
  
  margin-bottom: 20px;
  
  }
 

...in the Custom CSS? I haven't tested it extensively but it's a place to start. You may want to fiddle with the margins to balance the spacing. 

On 10/10/2019 at 2:16 AM, piccadilley said:

Thank you so much, Colin! Tried the CSS but it didn't produce a result on the site.

Are you talking about gallery blocks or project galleries?