Wordpress Themes - WP Forum at BFA - Centering my logo better/adding a second logo

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)

- Header configuration & styling (http://forum.bytesforall.com/forumdisplay.php?f=15)

- - Centering my logo better/adding a second logo (http://forum.bytesforall.com/showthread.php?t=601)

Centering my logo better/adding a second logo

I am wondering if the logo area is a table with 2 columns? (A column that holds the logo image and a column that holds the RSS/Search Box)
http://www.tracyandcarol.com/the_tra.../02/center.jpg

If it is... I would like to add a column above the left sidebar, making the logo area 3 columns, so that my logo can reside in the center column and be centered more over the center area of my page. (I would possibly put an image in the new, left column if possible)

Thank you

In bfa_header_config.php, after

PHP Code:


		
			
$logo_area = '<table id="logoarea" cellpadding="0" cellspacing="0" border="0" width="100%"><tr>';

add

PHP Code:


		
			
$logo_area .= '<td rowspan="2" id="logoarea-left" valign="middle">
<img src="/path/to/image.gif" alt="text..." /></td>';

and add through HTM/CSS Inserts -> CSS Insert

HTML Code:

td#logoarea-left {

width: XXXpx; /* XXX = width of left sidebar */

.... other styles

}

to style the left column, or add an ID to the image and style that through a CSS Insert, or add the styles inline with <img style="...." or <td style="...."

Hi Flynn,
I seem to be having a terrible time getting my logo centered just right. I appreciate the time and help you've given me to get this right. It's very close but not quite there. I've followed the steps you've given and here is the result... Not in the center above the center area)
http://www.tracyandcarol.com/the_tra.../row_span2.jpg

The above was accomplished with

Quote:

$logo_area = '<table id="logoarea" cellpadding="0" cellspacing="0" border="0" width="100%"><tr>';
$logo_area .= '<td rowspan="2" id="logoarea-left" valign="middle">
<img src="/path/to/image.gif" alt="put image here" /></td>';

in my bfa_header_config.php.

I thought I could figure out, from what you've given me, how to get my page to display how I want. So I changed rowspan to = 1 like so...

Quote:

$logo_area = '<table id="logoarea" cellpadding="0" cellspacing="0" border="0" width="100%"><tr>';
$logo_area .= '<td rowspan="1" id="logoarea-left" valign="middle">
<img src="/path/to/image.gif" alt="put image here" /></td>';

My logo gets centered correctly, but the search box moves to the left side. (which I don't want)
http://www.tracyandcarol.com/the_tra.../row_span1.jpg

This is what's in my HTML/CSS INSERTS > CSS...

Quote:

td.logoarea-left {
width: 200px;
}

td.logoarea-logo {
width: 100%; /* to make this cell get all available width */
}
td.feed-icons,
td.search-box {
width: 200px; /* to limit these cells to the width of the right sidebar*/
}
img.logo {
margin: 0 auto; /* center image */
}

I'm afraid I might have other code somewhere that is conflicting with what you've posted, making it very difficult to center this.

Thanks http://www.tracyandcarol.com/

Hi Flynn,

Here is where I am at...

http://www.tracyandcarol.com/the_tra.../near_done.jpg

My main logo centered how I've been wanting when I added the secondary logo. - I could not center the overlay that holds the date so I ended up using "margin-left: 39%;", which doesn't center it real well. I tried to follow the instructions you gave on centering the div container, but it would not budge from the left side. Lastly, the search box seems to be further down from the RSS icons. Do you know why that happened?

Thanks

Also... I am unable to style the <td> that contans the logo on the left. (The "M") That's why it is aligned to the top still.

Hi Flynn,

I've been able to get my logo area to be in a position more to my liking.
http://tracyandcarol.com/the_tracy_t...near_done2.jpg

I've been trying for days to position the left logo to be centered horizontally and vertically.
http://tracyandcarol.com/the_tracy_t.../left_area.jpg

No matter what I try, or where I put the code, this image won't budge from its spot. (This isn't the image I'll be using in this area, but I have not decided on which image I'll use) Do you have any ideas/suggestions on how to center this area?

Thanks http://www.tracyandcarol.com/

EDIT: I figured it out.