Full width region possible [#2070479]

Comment #1

benjmarr CreditAttribution: benjmarr commented 21 August 2013 at 05:06

I should clarify... Running the "Magic" style but i have a few sections (header and nav) that i want to extend out to 100% of window width.

Log in or register to post comments

Comment #2

fubhy CreditAttribution: fubhy commented 21 August 2013 at 07:58

Status:

Active

» Fixed

Apply the grid container to every element (except the two that you want to span 100%) separately instead of the entire body or page container. By not applying the grid container to the header and nav they will stay at 100%. I think the ohm-hero layout has an example for that?

Log in or register to post comments

Comment #3

benjmarr CreditAttribution: benjmarr commented 21 August 2013 at 08:35

Ill have a look at the ohm example and try work it out!! Once I have I will add to the documentation.

Loving the new workflow and processes!!

Log in or register to post comments

Comment #4

4 September 2013 at 08:41

Status:

Fixed

» Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

Log in or register to post comments

Comment #5

kclarkson CreditAttribution: kclarkson commented 8 September 2013 at 21:56

Status:

Closed (fixed)

» Active

@fubhy,

I too am trying to have a full width header and footer. Could you let me know what file in OHM you are referencing as an example ? I have looked at both the layout.scss and the page.tpl.php and they look exactly the same.

It would be great to have a full width header and footer document in the theme already.

thanks,

Log in or register to post comments

Comment #6

fubhy CreditAttribution: fubhy commented 9 September 2013 at 08:29

Status:

Active

» Fixed

I am referring to the ohm-hero layout template file ohm/layouts/ohm-hero.

I don't see the point of documenting specific layout setups or region layouts as that's really just a question of using CSS and HTML together. We can't document every single aspect of CSS and HTML "development" unless we want to be finished with the documentaiton in a timely manner. However, creating full-width footers and headers is not hard. Just don't apply any grid container or grid element mixin / css to it. Unless floated or otherwise manually altered, a HTML block element (like a div, for example) always spans 100% of it's container (full-width). So simply by doing *nothing* you will get a full width header/footer. In order to *add* gridded width constraints to an element you have to apply grid mixins/css to it.