## Nav A responsive, pure css navigation menu: > On these smaller versions it might have small glitches. Please see the top, page-wide nav to see the actual effect. ```html

``` ### Responsive The nav is responsive by default. The text inside the `` can be changed for the following characters for a different effect ([source](https://css-tricks.com/three-line-menu-navicon/)): - Identical to `≡` (safe on mobile): ≡ - Trigram for heaven `☰`: ☰ - Any other: ### Different height and big logo Thanks to a [vertical-align trick](http://zerosixthree.se/vertical-align-anything-with-just-3-lines-of-css/), you can set it up to any height you want: ```css nav.imponent { padding: 2em 0; } .imponent .logo { height: 3em; } ``` ```html ``` ### Form elements Just get anything you want inside the nav, most things should work. ```html

``` ```html

``` ### Fixed position To set it on the top of the page instead of scrolling with the page, just do: ``` nav { position: absolute; } ``` ### Open nav menu from left Change sass variable `$picnic-nav-open-left: false !default;` to `$picnic-nav-open-left: true;` to open it from the left: ```html

```