Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Center area post/pages »

Styling the sidebar/center column area with different backgrounds on each page

Old Oct 2, 2012, 11:10 AM
50 posts · Mar 2010
I am trying to put different background images on each page. Basically, it's the "container" area, encompassing the header, page menu, and sidebars/center column, but NOT the footer area.

So, I broke the background images into 3 parts - header, page menu, and sidebar/center area.

After much playing with the styling, I got it to work! In Firefox. See http://youcangrowthat.com.s52126.gridserver.com/

Then I looked at Safari and IE. Oops. Header and Page Menu look the same as Firefox, but not the sidebar/center area.

Now, the styling for the header and page menus is styling a div, and the styling for the sidebar/center column is styling a table row, and I suspect that is the difference.

/* -------------------------------------------------------*/
/* background image for page menus for garden centers */
/* -------------------------------------------------------*/
body.page-id-14 div#page-menu-div {
width: 990px;
height: 24px;
top center no-repeat;
/* garden centers */

body.page-id-14 tr#bodyrow {
width: 990px;
height: 1086px;
top center no-repeat;

If the problem is the difference between styling a div and styling a table element, is there somewhere in the styling I can put a div that will hold both the sidebars and the center column?

Old Oct 2, 2012, 11:17 AM
50 posts · Mar 2010
Alternatively, can I add something to the styling of the table row to make it display correctly?

Is there a firebug equivalent for Safari and/or IE?
Old Oct 2, 2012, 11:23 AM
50 posts · Mar 2010
And yes, I tried styling the "container" div instead, with a single image, but that a) includes the footer area and b) created its own problem - the image was cut off at the bottom just below where the page text in the center column ends. If however, that is the better solution, and I can work out any issues with that, like putting a different image in the "container" on each page, I'll do it. Not knowing what issues will come up with that (Can the height of the "container" be specified, can I specify a different background image for each page?), I thought I'd try to continue on the current track, but if you have a better suggestion, I'm willing to try it!
Old Oct 5, 2012, 06:27 AM
50 posts · Mar 2010
Well, I ended up styling the "container" div instead with the full image. It's not exactly as I want it, but it will do for now. And it works in Firefox, Safari and IE.


background, center, container, sidebar, style

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Adding widget area to home/center column, but not post/page JennyD Center area post/pages 2 Feb 17, 2012 11:35 AM
[SOLVED] Not getting any styling or center column with 3.6.4 moomum New Versions, & Updating 6 May 10, 2011 02:52 PM
center area styling deltatango Atahualpa 3 Wordpress theme 5 Jun 7, 2009 03:28 AM
Center column styling: how can I remove margin or padding? bcorrigan Header configuration & styling 2 Apr 2, 2009 09:53 AM

All times are GMT -6. The time now is 06:17 PM.

Powered by vBulletin® Copyright ©2000 - 2021, Jelsoft Enterprises Ltd.