Has anyone successfully created this:

It is a small task, but I have been trying to have the top logo bar only for custom links (to site pages, Twitter perhaps) and styles.

The code below has created a link, but I am unable to style the bar from the options or through CSS.

In funtions/bfa_header_config.php:

$logo_area .= '</td>';}
// END of title/description
$logo_area.='<a class="email-icon" title="Contact the Book Babes" href="http://thebookbabesinc.com/contact-the-babes/">Contact Us</a>';

Now the challenge is styling the background color of the entire logo_area table as a whole. I tried this first through the options panel for the logo area, which only created a bar below it.

So I gave the logo_area the class "topbar" in line 54 of bfa_header_config.php:

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

Now I am not having any luck styling it in the "CSS Inserts" through the WP admin:

.topbar {
background-color: #000000;
}

Any ideas guys? Do I need to be changing the "topbar" table class CSS on the actual style.php file? Or do I need to do this differently?

Change this:

$logo_area = '<table id="logoarea" table class="topbar"

to this:

$logo_area = '<table id="logoarea" class="topbar"

and add a CSS Insert such as:

table#logoarea {
...
}

It's better to use an ID if available as ID's take precedence over classes. Also, that class "topbar" isn't required there as far as I can see, since there's already an ID. The class would make sense if you had several elements with that class and wanted to "group-style" all of them. Since you're dealing with one single area or element, you could just use the ID "logoarea"