WordPress.org

1. stuartirene
   Member
   Posted 1 year ago #

   Hi there,
   How can I remove the white space on the left and right of header, menu and footer except the main content on twenty ten, which is exactly like this forum?

   Know that modification should be done under structure but not sure exactly how: Please help!!! Thanks.

   /* =Structure
   -------------------------------------------------------------- */

   /* The main theme structure */
   #access .menu-header,
   div.menu,
   #colophon,
   #branding,
   #main,
   #wrapper {
   margin: 0 auto;
   width: 940px;
   }
   #wrapper {
   background: #fff;
   margin-top: 20px;
   padding: 0 20px;
   }

2. Lou Sparx
   Member
   Posted 1 year ago #

   Without seeing the problem I'm pretty sure if you remove the 20px padding from wrapper everything should line up flush.

   But, this may take away the padding for everything so either remove the 20px padding or add:

   padding: 0px -20px;

   To the header with the problem.

   Let me know if you need more detailed help ;)

3. stuartirene
   Member
   Posted 1 year ago #

   Hi Lou,

   Thanks for your reply. It seems like not showing any effect by either removing 20px padding or adding your suggested adjustment. Anymore suggestion? The following is what i have got in "Structure" under child twenty ten:

   /* The main theme structure */
   #access .menu-header,
   div.menu,
   #colophon,
   #branding,
   #main,
   #wrapper {
   width: 970px;
   }

   #wrapper {
   background: #FCFCFC;
   margin-top: 0px;
   padding: 0px -20px;
   }

   Please help!!

4. Lou Sparx
   Member
   Posted 1 year ago #

   Try:

   #wrapper {
   background: #FCFCFC;
   margin-top: 0px;
   padding: 0px !important;
   }

   and report back with results. My guess is the header has its own padding. Could you point me to a demo or the url with the problem?

5. stuartirene
   Member
   Posted 1 year ago #

   Hi Lou, thanks for your reply again. It doesn't work either. I guess it could be to do with the wrapper width of 970px, which is stopping #access .menu-header, div.menu, #colophon and #branding from expanding the full width except #Main. Having said that, I did try to zero the width solely for the affected areas but not successful. So was wondering if it could also be due to some width restriction/limitation in other related templates?

   Basically, mine is just a fresh new default skin of Twenty Ten that I wish to expand horizontlly the header, menu and footer to be looked like those in http://www.fotobeginner.com with all their content being constant at the center. This is just running header, menu and footer full width in any resolution.

   Hope you get what i mean. Thanks.

6. Lou Sparx
   Member
   Posted 1 year ago #

   My guess would be to move the header above the wrapper in index.php and go from there. Also change the header/menu width to 100%.

   I'll download 20-10 and see if I can help further.

7. Lou Sparx
   Member
   Posted 1 year ago #

   OK,

   Remove WIDTH and PADDING from WRAPPER.
   Add WIDTH: 100%; to MENU.
   Add WIDTH: 940px; to MAIN.
   Adjust header image to fit/width.

   Let me know how it goes :)

8. stuartirene
   Member
   Posted 1 year ago #

   Hi Lou, will try now. I have deleted <div id="wrapper" class="hfeed"> from header.php and seems to resolve the header part only but however, menu has moved to the left without its border flowing fully to the right to capture the whole width. Please have a look!

9. stuartirene
   Member
   Posted 1 year ago #

   Hi Lou, finally got it. thank you so much. The following are the code i used:

   /* The main theme structure */
   #access .menu-header,
   div.menu,
   #colophon,
   #branding,
   #wrapper {
   width: 100%;
   }

   #wrapper {
   background: #FCFCFC;
   margin-top: 0px;
   padding: 0 0;
   }

   #branding img {
   border-top: 0px solid #292421;
   border-bottom: 0px solid #292421;
   position: relative;
   margin-left: auto;
   margin-right: auto;
   }

   #access {
   background: #FCFCFC;
   width: 100%;
   border-bottom: 5px solid #8B7355;
   }

   Also, I got one more question to ask. Do you know how can I change the color of RSS widget title? For normal widget title, it's really straight forward but title with link is abit tricky as it is not isolated by itself. Could you please help? Thanks.

Topic Closed

This topic has been closed to new replies.