Equal Horizontal Spacing for Footer Elements

Site URL: https://delanydesigns.squarespace.com/

Password: 123456

Hi! I’m a little new to working with Squarespace, though I have taken a class on HTML and CSS.

I’m trying to get the links in my footer to take up an equal amount of space horizontally, but I can’t figure it out. I remember learning that using percentages in CSS pertains to the container of whatever element you are adding style rules for, so for 4 links I’d think that “width: 25%;” should work. But, as you can see in the screenshot, I’m not at all getting what I want. Is there something that I’m missing, such as padding or margins or something taking up space and making those percentages not add up correctly?

Can someone help, please? Thanks!

(Also, in case it makes a difference, my site is currently not public because I’m just getting started on it.)

CSS:

Quote

div#block-f870ea3fe206be690057 {
  width: 25% !important;
}

div#block-yui_3_17_2_1_1644887303584_13576 {
  width: 25% !important;
}

div#block-yui_3_17_2_1_1644887303584_16476 {
  width: 25% !important;
}

div#block-yui_3_17_2_1_1644887303584_17415 {
  width: 25% !important;
}

12 hours ago, paul2009 said:

Unless I have misunderstood your question, you shouldn't need any code for this.

Simply add four Text Blocks to the footer. You can then add your links to each of the blocks. They will be spaced equally and will 'collapse' when the site width is reduced, keeping them responsive. Here's a video. 

Thanks! That’s helpful, and I think it helps me solve my issue pretty well.

I just wish Squarespace’s layout editing tools included more advanced features like smart guides (basically what Illustrator and InDesign have).