Full width nav header 1920px

BB Theme
1

I want the logo and the navigation to be at a width of 1920px with 20px left and right padding so that only the nav is stretched to the full width of the screen on desktop, How can i achieve this working on WAMP?

2

Hey Matthew,

There is no setting in the BB Theme to achieve that but I think it can be done via custom CSS. Which header layout are you using? Can you perhaps do a mockup? You can post it to imgur and paste the link here so we can check. Got a bit confused when you say you want the logo and navigation to be 1920px wide but you only want the nav to be stretched to full width.

Ben

3

Here is the design lay I want to achieve http://i.imgur.com/Sscwbsk.jpg I am using the default layout

4

Hi Matthew,

If I understand you correctly and I apologise in advance if my assumption isn’t correct. But I don’t believe you want your navigation to be set to a specific width of 1920 pixels, instead I believe you want your navigation to be full-width across your header.

Is this assumption is correct, can you try the following CSS, please?

@media (min-width: 992px) {
  .fl-page-header-container.container {
      width: 100%;
      padding-left: 20px;
      padding-right: 20px;
  }
}

Thanks,
Danny

5

Yes I would like full width navigation. I tried the CSS and it did not work

6

Hi Matthew,

Where did you add the code? As I tried it on my test site before providing it to you. Can you provide a screenshot of where you added the code, please.

Thanks,
Danny

7

I tried it in both the Global Settings and the Layout setting in Tools

8

Hey Matthew,

Try placing the code in the theme customizer section Appearance > Customize > Code > CSS Code and see if it works.

Ben

9

Hi Ben that works but that then places the code within the head not in a css file.

10

Hey Matthew,

You can also place it inside your child theme’s style.css file. The problem with using Tools > Layout Settings is that all codes that are placed there will be added on a per page basis. That means you’ll have to add the code manually every time a new page is created if that makes sense. :slight_smile:

Ben