CSS Help

[charriott4]

http://avance2.myprowebsolutions.com/

Can anyone point me in the right direction on how to position the content of the page to center?

I repositioned the wraps so I can have full a width background on the #inner section but have been trying for 2 days to figure this out while still making sure its responsive and that it will work on all page layouts.

---

Web Designs By Chrissy | Twitter @designbychrissy

Follow Me On Facebook

[TishaOehmen]

Check out this tutorial: http://genesistutorials.com/genesis-structural-wraps-creating-a-full-width-genesis-child-theme/

---

Tisha Oehmen, Paradux Media Group
Twitter: @TishaOehmen

[RonnyMac]

Maybe I'm missing something or copied and pasted incorrectly but I can't see that the Full Width snippet in GenesisTutorials does anything in functions.php.

In the Genesis 1.9.1 Child theme, each region-- header, nav, subnav, inner, foot-widgets, and footer-- have an inner #wrap already. And all the regions are wrapped in the body #wrap.

If the width of the body #wrap is set to 100% then the inner regions have no margin. Setting the inner regions to width: 1152px; and margin: 0 auto; seems to work, while giving the body #wrap a width of 100%.

If that tutorial snippet does anything in functions.php I can't see it. What am I missing?

---

ronnymac
—
Ron McElfresh
Honolulu, HI
—
http://mac360.com/
http://mcelfresh.org/
http://mcsolo.com/
http://pixobebo.com/
http://noodlemac.com/

[Joseph Lee]

You are correct in the use of

Margin: 0 auto;

It is centered right now. The problem is you need to apply a width. Right now the width of the #inner is not defined. It's basically 100% of the page. If you write width: 960 px; under #inner then the page will center under the navigation.

 

I think this is what you are asking. I apologize if I misunderstood you. Please let me know if I am incorrect and I will assist you further 🙂

[RonnyMac]

OK, I see it. Finally. It's too early in the day.

This provides another .wrap inside the #inner, which can be useful. How does one put a full width header-only background color without another wrap?

I can set the #wrap to 100%, then set each region to a width of 1152px, but any color background in the #header remains at 1152px. So, is it best to set the #wrap and #header at 100% width, then center the inner .wrap?

---

ronnymac
—
Ron McElfresh
Honolulu, HI
—
http://mac360.com/
http://mcelfresh.org/
http://mcsolo.com/
http://pixobebo.com/
http://noodlemac.com/

[bandj]

You set the divs like #header, #nav, #subnav etc to 100% and give the .wrap the width you want. The wraps are inside the divs so you could try

#header, #nav, #subnav, #inner, #footer-widgets, #footer width to 100%

then set #header .wrap, #nav .wrap etc to whatever width you want.

[RonnyMac]

Yep, that does it. Perfectly. A bit convoluted but easy enough.

Thanks!!

---

ronnymac
—
Ron McElfresh
Honolulu, HI
—
http://mac360.com/
http://mcelfresh.org/
http://mcsolo.com/
http://pixobebo.com/
http://noodlemac.com/

[Author]

Posts