Jump to content

restaurant menu spacing

Recommended Posts

  • Replies 12
  • Created
  • Last Reply

Top Posters In This Topic

Here is some Custom CSS to add to your website.

For the spacing between menu items:

.menu-block .menu-item {
    padding-bottom: 1em;
}

For between menu sections:

.menu-block .menu-section+.menu-section {
    margin-top: 3em;
}

Adjust the values as you like.

Let me know if that improves the look for you.

Edited by Ziggy

Please like and upvote if my comments were useful to you. Thanks!

Zygmunt Spray
Squarespace Website Designer
Contact me: https://squarefortytwo.com/ 
🔌Ghost Squarespace Plugins (Referral link)
Buy me a coffee

Link to comment
  • 3 weeks later...

Hi Ziggy, working like a charm. I's like to make the font smaller for across the board:

  • Menu title (ex: Prix Fixe Lunch in the actual menu not menu nav)
  • Section titles (First Course)
  • Dish Titles (Insalata Fantasia)
  • description (baby greens, julienned carrots, etc)

I think this will do the trick, but I might want to adjust the Dish title being bold and make it regular, but want to see how it looks if i just make the font smaller.

Are you able to help with code?

Thank you!

Link to comment

Thank you! I didn't realize I could adjust some of those in styles because it's not in the main font section. i clicked thru and found it! Awesome. 

Is there a way to create a bar above the nav bar? Not an announcement bar.  I want to move the address and phone number up top (both clickable). And then I can clean up the footer a bit.  Thank you 🙂

Link to comment

This might help as a start for HTML header code injection method:

<html>
  <div style="background-color:red; padding:8px 4px;" display:block;>
    <p style="text-align:center">
      text here
    </p>
  </div>
</html>

 

Please like and upvote if my comments were useful to you. Thanks!

Zygmunt Spray
Squarespace Website Designer
Contact me: https://squarefortytwo.com/ 
🔌Ghost Squarespace Plugins (Referral link)
Buy me a coffee

Link to comment

Create an account or sign in to comment

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

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.