How do I add padding between two links in my navigation?

So thanks to another kind Squarespace user, I know how to target a specific element of the navigation. I've gotten the color of the link to change and even added a line to the top part of the element:

/ This targets the penultimate link of MAINNAV: / header#header nav.main-nav.dropdown-click ul li:nth-last-child(2) a { color: #316977 !important;
padding-top: 5px; border-top: 1px solid #414141; }

What I'd like is to add padding to the bottom of the element before this "Contact the Experts" (which I know would be ....last-child(3)... but it seems that because of the line-height, I can't add padding or something like that. When I try changing the line-height of the element above ("What's my home worth?), it DOES alter the space between it and the element above it "Contact".. but of course it adds extra space between it and the element below it "Property Search"... There has to be a way to sort of override the line-height setting to create more separation between two specific lines right?

Hope someone can help! THANKS! www.liluxemiami.com

asked Mar 08 '13 at 13:37 by lysisgalnares 35125

0
1

Hi there,

The CSS is targeting the a tag, whereas for the padding/spacing you really want to be targeting the li tag that is the parent of the a tag. You can use this CSS to do so:

/* This targets the penultimate <li> item of MAINNAV: */ 
header#header nav > ul > li:nth-last-child(2) { 
  padding-top: .5em;
  margin-top: .5em;    
}

You might consider moving the border onto this element instead, for a cleaner effect.

answered Mar 09 '13 at 10:59 by subpar 740111

link

That worked beautifully, thank you!!

(Mar 11 '13 at 07:41) lysisgalnares lysisgalnares's gravatar image
Your Answer
toggle preview

Follow This Question

Once you sign in you will be able to subscribe for any updates here

Markdown Basics

  • *italic* or __italic__
  • **bold** or __bold__
  • link:[text](http://url.com/ "title")
  • image?![alt text](/path/img.jpg "title")
  • numbered list: 1. Foo 2. Bar
  • to add a line break simply add two spaces to where you would like the new line to be.
  • basic HTML tags are also supported

Tags:

×291
×91

Asked: Mar 08 '13 at 13:37

Seen: 1,587 times

Last updated: Mar 11 '13 at 07:41

Established 2004 Handmade in NYC