nathansmith / unsemantic

Fluid grid for mobile, tablet, and desktop.
http://unsemantic.com
MIT License
1.38k stars 161 forks source link

break out of grid #24

Closed ethanpil closed 10 years ago

ethanpil commented 10 years ago

Hi,

This isnt an issue really, more of a question, I am wondering if it is possible for an element to break out of the grid.

For example, within the grid I want to make a menubar under the logo that has a background which is the full width of the window. I still want the menu items to be within the grid container alignment.. For example, see http://beauty.com the white menu bar goes full width.

I dont think there is a way to do this with unsemantic, but I figured I would ask...

nathansmith commented 10 years ago

Sure, for that you'd just do something like…

<header role="banner" id="header-that-is-full-width">
  <div class="grid-container">
    <!-- grid content here -->
  </div>
</header>
<main role="main">
  <div class="grid-container">
    <!-- grid content here -->
  </div>
</main>
ethanpil commented 10 years ago

Yes, I just figured it out a minute ago and was going to delete this... it wasnt obvious to me at first.

In case anyone else needs this:

I had originally put

<body class="grid-container"> 

which locked me in.

Now I applied

<div class="grid-container">
....
</div>

around everything except the menu elements and it works like a charm!! Thanks for your time, sorry to bother...