Guizones Posted November 27, 2014 Share Posted November 27, 2014 When you add a line in the content, the padding around the line is a bit big, considering that some templates already have a established huge padding. Is there a way to target the line and make the padding around it smaller? My site: db-arquitetura.squarespace.comRight below the first banner there is a line, some content and then another line. I feel that it would look much nicer with a smaller padding around the horizontal rule. Any help would be great. Link to comment
Lar Posted November 29, 2014 Share Posted November 29, 2014 The key I believe is using margin for the HR tag instead of padding. I used the following in the Custom CSS Editor: .sqs-block-content hr { margin: 0; border-style: none; height: 3px; width: 100%; background-color: #FF0000; } Link to comment
Guest Posted March 22, 2015 Share Posted March 22, 2015 You can also try just with the margin options: .sqs-block-content hr { margin-top: 0px !important; margin-bottom: 0px !important; } Link to comment
rmanke Posted June 24, 2016 Share Posted June 24, 2016 Thanks for the tip, but both of the solutions seem to only affect the top of the HR, not the bottom. Is there another way to specify the bottom? Link to comment
rmanke Posted June 24, 2016 Share Posted June 24, 2016 Thanks for the tip, but both of the solutions seem to only affect the top of the HR, not the bottom. Is there another way to specify the bottom? Link to comment
Jennifer-Badr Posted January 22, 2020 Share Posted January 22, 2020 I am also not having any success with that second block of code reducing the bottom margin padding. Jennifer Badr - MFA | MS Design & Marketing Professional Link to comment
stur Posted January 30, 2020 Share Posted January 30, 2020 Anyone found a solution for this? the top works great - however when you change the bottom margin nothing seems to happen. .sqs-block-content hr { margin-top: -10px !important; margin-bottom: -10px !important; } Link to comment
Tusc Posted April 24, 2020 Share Posted April 24, 2020 Figured out a fix for the bottom margin! 😍 .sqs-block-content hr { margin-top: -10px !important; } .sqs-block-horizontalrule { margin-bottom: -30px !important; } Link to comment
JOHNMD Posted April 24, 2020 Share Posted April 24, 2020 One option is to replace each line block with a Code Block on the page. Then insert the code below. (you can adjust the line length (width) in % , for example to 50%, and change the thickness and line color in the code): <style> hr.line { border-top: 1px solid light-gray; width: 75%; } </style> <body> <hr class="line"> </body> mcgouran.john@gmail.com Link to comment
Recommended Posts
Archived
This topic is now archived and is closed to further replies.