Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Removing Extra Padding in Brine Mobile



I'm working on adding images/banners to my homepage at http://vedranmisic.com (password: sunday).

On the desktop version, the padding looks great, but on the mobile there is a lot of empty space between each banner. And I don't see styling option to reduce this on mobile.

Could you please provide me with CSS code to reduce this padding?

Thanks so much,


Screen Shot 2019-10-28 at 9.56.40 AM.png

Share this post

Link to post

2 answers to this question

Recommended Posts

  • 0

Try adding the following to your custom css, after any code that may already be there. 

@media only screen and (max-width: 640px) {
	#block-yui_3_17_2_1_1572055006330_3766, #block-yui_3_17_2_1_1572055006330_10549 {
		// This removes top and bottom padding from both image blocks
		padding-bottom: 0;
		padding-top: 0;
	#block-yui_3_17_2_1_1572055006330_10549 {
		// This adds a bit of top padding to the bottom image block - tweak as you like
		padding-top: 5px;


Please hit LIKE to share your appreciation of posts that are helpful or useful. 

The like button is somewhere over thereover-there.jpg

Of course, Likes don't pay the bills.. If you're looking for a Squarespace Developer you can hire me here

Share this post

Link to post
  • 0

Hi @colin.irwin

Thanks so much. I added the code you provided, and the padding between two bottom banner was reduced, but not between the top and second banner. 

Also, the bottom banner has shifted left and up now, showing a gray backround. I'll attach a screenshot to show you these two issues. 
Let me know please if you have a solution.

Thanks so much!

Screen Shot 2019-10-28 at 3.10.49 PM.png

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

  • Create New...