Metro: Stretch header+footer

[ithacaindy]

I think Metro is a fabulous design. I have the background set to white. What is the most efficient way to have an edge-to-edge header and footer while maintaining responsive design for tablets?

 

 

[Tony @ AlphaBlossom]

Adding this to your child theme's function.php will add an extra wrap div () inside your header and footer, which allows your header and footer to be full width. You now have a new wrap div inside your header and footer which you can set to your container width.


/** Add support for structural wraps */
add_theme_support( 'genesis-structural-wraps', array(
'header',
'footer'
) );


Use css on your #header and #footer to set them for 100% width.

(Add nav, subnav, inner, and footer-widgets to the code above if you want to add the extra wrap to these, fyi).

You can install one of the full-width themes to see how the css is handled and copy that to your metro child theme css.

Take care,
Tony
AlphaBlossom

---

Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom

[Author]

Posts