Wordpress Themes - WP Forum at BFA
Click Here To DONATE! Support the theme development, get more attention and additional benefits based on your donation level. Your forum name will be highlighted.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Sidebars & Widgets »

Background CSS for overlaid new widget areas


Build custom WP THEMES, without
coding.
Click here for THEMEFRAME

From the author of Atahualpa, the #1 most
downloaded (700,000+) theme @ wordpress.org
 
Prev Previous Post   Next Post Next
  #1  
Old Dec 23, 2010, 11:46 AM
Wimbledon's Avatar
Wimbledon
 
320 posts · Apr 2009
[VA & AZ], USA
Background CSS for overlaid new widget areas

Site created with Atahualpa 3.5.3 and Wordpress 3.0.1 here:

www.lotuseterneforum.com

I have created two widget areas:
  1. HeaderArea, which is split into two cells.
  2. HeaderBG, which is currently colored green and is one cell. HeaderBG is greater in height than HeaderArea.

If you look at the site, you will see the second "HeaderArea" cell at the top which holds a 468x60 ad. You will also see img.logo ("Lotus Enthusiast") on the left side.

I am trying to move the green-colored HeaderBG behind HeaderArea and img.logo, to create a background behind the two. HeaderBG needs to span the entire width of the layout, which is fixed at 1189px. When positioned lower, HeaderBG does already span the layout with its green color.

How do I force the color of HeaderBG to be "shown through" the empty spaces in HeaderArea and img.logo?

For maximum clarity, here is a rendering of what I am trying to accomplish:



Here are the relevant CSS inserts I already have:

img.logo {
position: absolute;
top: 30px;
left:18px;
z-index: 59;
}

div#text-6.widget{
position: absolute;
top: 30px;
right: 18px;
z-index:60;
}

div#headerbg.bfa_widget_area{
background: #097054; [This is the green color]
height: 100px !important;
z-index:55;
position: absolute;
top: 25px;
}

Without success, I have tried to add the following to img.logo and div#text-6.widget:

background: transparent !important;

Can anyone figure out what I'm doing wrong? What else should I try?

I greatly appreciate any help!
 

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] styling background in header widget areas emanuel1969 Sidebars & Widgets 5 Apr 30, 2010 08:40 PM
How to change widget areas order on widget page JFG Sidebars & Widgets 0 Apr 19, 2010 02:07 PM
[SOLVED] Background Image in New Widget Areas? Rashell Sidebars & Widgets 2 Dec 31, 2009 05:18 PM
Widget areas 1 to 4 Ddabrai Sidebars & Widgets 2 Aug 15, 2009 02:48 AM


All times are GMT -6. The time now is 07:47 AM.


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