Header and nav menu problem on Thesis site

Question

Header and nav menu problem on Thesis site

Les Thomas

2012年10月1日 15:03

Unfortunately I managed to make the header image disappear and the horizontal nav menu distort on this Thesis themed Wordpress site I'm helping a friend with

www.euanmitchell.com.au

I've pasted the code from Thesis custom.css and custom-functions.php below. Any help is much appreciated.

Cheers,

Les

    File: custom.css
Description: Custom styles for Thesis
More Info: http://diythemes.com/thesis/rtfm/custom-css/
*/

#header {
border: none;
background-image: url(http://euanmitchell.com.au/wp-conten...bannerv6.jpg);
background-repeat: no-repeat;
height: 208px;
padding: 0;
position: relative;
}

.custom #header #logo a {
text-indent: -9999px;
width: 450px;
height: 169px;
display: block;
float: left;
}

.custom .teaser {
width: 100%;
margin-top: 2em;
padding-top: 2em;
border-top: 1px dotted #bbb;
text-align: justify;
}
.custom .teasers_box {
padding-top: 0;
padding-bottom:0;
border-top: 0;
}

.custom #header { height:150px; background:transparent url(images/header.png) center no-repeat; } 



 ?php
/* ---:[ place your custom code below this line ]:---*/

remove_action('thesis_hook_before_header', 'thesis_nav_menu');
add_action('thesis_hook_after_header', 'thesis_nav_menu');
remove_action('thesis_hook_footer', 'thesis_attribution');

?

Topic custom-header theme-thesis menus Wordpress

Category Web

Kirill Fuchs · Accepted Answer · 2012年6月20日 14:12

The nav bar:

Your float:left; property in:

.custom #header #logo a { text-indent: -9999px; width: 450px; height: 169px; display: block; **float: left;** }

is causing the nav bar to act all funny. You have 2 options:

get rid of the float left.
clear your float left after the logo.

IE: add clear:left; or clear:both; to your .menu-custom-container

The Image:

It seems its unable to find header.png in

wp-content/themes/thesis_184/custom/images/header.png

Also it looks like you have uploaded the header image into the theme.

could this be it? http://euanmitchell.com.au/wp-content/uploads/2012/05/euanbannerv6.jpg

if that's the case you can completely get rid of the background-image and split the remaining properties into individual properties since #header contains this code:

background-image: url(http://euanmitchell.com.au/wp-content/uploads/2012/05/euanbannerv6.jpg);

so your new css would be:

.custom #header { height:150px; background-color:transparent; background-position: center; background-repeat:no-repeat; }

That will take care of the image not showing up.

Edit:

Also you don't need the no-repeat because it also in the #header or the transparent color because it's white anyway. TBH they don't add anything, the only real property your adding is background-position:center;.

Header and nav menu problem on Thesis site

About