Border top and bottom around navigation/menu

Hi folks,
Despite adding the following custom CSS borders still remain:

/* BB Theme Styling */
fl-page-nav-wrap {
border-bottom: none;
border-top: none;
padding: 0;
border-color: #e6e6e6;
background-color: #ffffff;
color: #000000;
}

See here: http://cartmelluxurycottages.co.uk/

Any thoughts why - don’t really want to add !important

Many thanks

Darron

Hi Darron,

Your CSS above is missing the period (.) at the beginning of the rule. Can you try adding the period and see if this resolves your issue, please?

Thanks,
Danny

Hey Danny
Still no joy I’m afraid. Added (.) period and stripped out color setting - see here: http://cartmelluxurycottages.co.uk/

Hi Darron,

Can you try the following CSS, please.

.fl-page-header .fl-page-nav-wrap {
  border-bottom: 0;
  border-top: 0;
}

Thanks,
Danny

worked perfectly Danny - again, thanks so much!

Darron

appreciate all your help :slight_smile:

Danny, forgot to ask earlier -why when borders are visable - see footer border line at bottom of page: http://cartmelluxurycottages.co.uk/ are wider than my page width size (the same was happening with the nav border before you helped to hide the lines

Thanks again

Darron

Hey Darron,

That’s because that border is applied after the content, which has no padding/margin, i.e., it uses the content width which is 1040px. The border you have on the Separator module, is placed in a fixed width row, 960px, and has a 20px margin on each side.

Hope this helps!

Ben

Hey Ben,
I suppose this relates to my other question.

I’m totally screwing up this content width/borders etc as mentioned in the other post.

I set the content width to be 960px see here: https://gyazo.com/4acd2c7fa368738efb7c48e6c2e3988d so still not getting it. Where is this 1040px set?

Thanks again

Darron

Hey Darron,

We’re actually adding 40px buffer on each side for when the site goes responsive. So that’s 960px + 40px + 40px. :slight_smile:

Ben

Thanks Ben - daft question then -how do I make the footer top border match my site width of 960px when viewed not on mobile device/tablet

Darron

Hi Darron,

Can you try the following CSS, please.

@media (min-width: 992px) {
  .fl-page-footer-wrap .fl-page-footer {
    margin-left: 40px;
    margin-right: 40px;
  }
}

Thanks,
Danny

Many thanks Danny for the enclosed.

Can’t help feel I’m overcomplicating things with this site in needing to add extra css

Darron

Hi Darron,

No problem and I wouldn’t say you were overcomplicating things, more like fine-tuning. :wink:

Thanks,
Danny

Ha! Thanks so much Danny :slight_smile: