Jump to content

Middle-align text in nav (vertically) with logo

Recommended Posts

The nav text in many templates it seems (at least in what I'm using, viewable at http://flf.org ) is vertically-aligned to the top of the logo by default. How do I make it so that the nav text is vertically middle-aligned with the logo, such that the vertical middle of the logo is the same as the vertical middle of the nav text?

Edited by jmj123
Link to comment
  • Replies 6
  • Views 1.9k
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

On 12/6/2023 at 9:08 AM, tuanphan said:

I think because of font name, you try changing font name of nav items

initial

image.thumb.png.bd2694f22ae836f56f5663601109fcc2.png

I tried changing it to monospace font with code on my browser

image.thumb.png.27acc6afe3362cde01b2cbe4a35d8d85.png

I appreciate your looking at it, but I'm not really interested in changing the font to a different one. Any idea how to fix this without changing the font?

Link to comment
  • 1 month later...
On 12/10/2023 at 3:18 AM, tuanphan said:

Add this to Website Tools (under Not Linked) > Custom CSS to move down nav items, you can adjust number to what you feel okay

div.header-nav-item {
    position: relative;
    top: 5px;
}

 

Thanks, but the correct offset using this method is affected by screen size, so this method doesn't work. There should be a solution that gets it in the right div or something.

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.