Title: Full width header + navigation position
Last modified: April 28, 2020

---

# Full width header + navigation position

 *  Resolved [Eivind](https://wordpress.org/support/users/eivsemb/)
 * (@eivsemb)
 * [6 years, 1 month ago](https://wordpress.org/support/topic/full-width-header-navigation-position/)
 * Hey!
 * I am currently rebuilding the entire website using GP/GB and I’m facing some 
   issues with designing the header.
 * I want to have a full width header with logo on the left side, the menu in the
   center, and then two buttons on the right side. I am using the header widget 
   with custom html for the two buttons, and I have also specified “Header width”
   and “Inner header width” as Full. “Navigation location” is set to Float Right(
   no option for float center?).
 * I want the header to look like this:
    [https://coinpanda.io/](https://coinpanda.io/)
 * This is what I have managed so far:
    [https://dev.coinpanda.io/](https://dev.coinpanda.io/)
 * I don’t understand why the header is still contained when I have specified “Full”.
   The navigation is also shown below the logo / widget which it should not be.
 * Any tips? Thanks!
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Ffull-width-header-navigation-position%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 3 replies - 1 through 3 (of 3 total)

 *  Theme Author [Tom](https://wordpress.org/support/users/edge22/)
 * (@edge22)
 * [6 years, 1 month ago](https://wordpress.org/support/topic/full-width-header-navigation-position/#post-12747953)
 * Hi there,
 * It looks like your site header is set to contained. If you set that to “Full”
   you should be able to use this CSS:
 *     ```
       .inside-header {
           display: flex;
           align-items: center;
       }
   
       .site-logo {
           order: 1;
       }
   
       #site-navigation {
           order: 2;
           margin-left: auto;
           margin-right: auto;
       }
   
       .nav-float-right .header-widget {
           order: 3;
           top: 0;
       }
       ```
   
 * Hope this helps 🙂
 *  Thread Starter [Eivind](https://wordpress.org/support/users/eivsemb/)
 * (@eivsemb)
 * [6 years, 1 month ago](https://wordpress.org/support/topic/full-width-header-navigation-position/#post-12749661)
 * Thanks, that solved the issue with centering the navigation!
 * I figured out why the header wasn’t full width myself: I’m using header element(
   merge with content to get transparent header), and I just had to select Full 
   width for Container (Page Hero tab) to display as full width.
 * Regards
 *  Theme Author [Tom](https://wordpress.org/support/users/edge22/)
 * (@edge22)
 * [6 years, 1 month ago](https://wordpress.org/support/topic/full-width-header-navigation-position/#post-12752613)
 * Glad you got it all working 🙂

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Full width header + navigation position’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/generatepress/3.6.1/screenshot.
   png)
 * GeneratePress
 * [Support Threads](https://wordpress.org/support/theme/generatepress/)
 * [Active Topics](https://wordpress.org/support/theme/generatepress/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/generatepress/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/generatepress/reviews/)

## Tags

 * [header](https://wordpress.org/support/topic-tag/header/)
 * [menu](https://wordpress.org/support/topic-tag/menu/)
 * [navigation](https://wordpress.org/support/topic-tag/navigation/)

 * 3 replies
 * 2 participants
 * Last reply from: [Tom](https://wordpress.org/support/users/edge22/)
 * Last activity: [6 years, 1 month ago](https://wordpress.org/support/topic/full-width-header-navigation-position/#post-12752613)
 * Status: resolved