Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 1
Sign in to follow this  
Guest

How can I change the top and bottom padding of horizontal rule?

Question

Guest

I have tried this bit of code:


hr { margin: 3px; }

and it worked, to an extent. The problem being it's adding a margin around all sides of the horizontal rule. As the margin px value increased, the shorter the horizontal rule got. I would like to be able to only effect the top and bottom padding of the horizontal rule. Can someone point me in the right direction to adjust this value? Much appreciated.

Edited by Guest
retag

Share this post


Link to post

6 answers to this question

Recommended Posts

  • 1

I imagine it would be:


hr { margin-top: 10px; margin-bottom: 10px }

or the shortened version is:


hr { margin: 10px 0 10px 0; }

Edited by kale

Share this post


Link to post
  • 0
Guest

Thanks, Kale. That seems to make sense, but for some reason that code is changing the weight of the horizontal rule and not dealing with the padding alone. As soon as I plug it in, the rules get bumped up to 10px in weight. Not exactly sure why a padding command would effect the weight…?

Share this post


Link to post
  • 0

I just tested and yes, you are correct, it expands the HR, so use margin instead -- it would be:

hr { margin-top: 10px; margin-bottom: 10px }

or

hr { margin: 10px 0 10px 0; }

Share this post


Link to post
  • 0
Guest

Perfect! That did it. Thanks for the help.

Share this post


Link to post
  • 0

Hi @Brice Beasley, I made a video tutorial for you on how to Change the Top and Bottom Padding. Hope this helps! https://www.askquesty.com/squarespace-answers/change-the-top-and-bottom-padding-squarespace-tutorial


Have Squarespace questions/task and need help today? **You can hire us here.** Our answers are on-demand, video recorded, and only cost between $5 to $25. Estimates are free, 100% satisfaction guarantee, and trusted by hundreds of small businesses.

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment

Sign in to follow this  

×
×
  • Create New...