Reputation: 399
Have you ever styling a wordpress header, and then found that header to ignore your CSS styling on lower-level pages? Could really use your help debugging this annoying issue -- thank you in advance!!
I'm creating a simple portfolio site for a friend here: http://sundryspirit.com/
The homepage has a global header atop the page that should be present on every page of the site:
<div id="header">
<div id="header-top">
<div id="logo">
<a href="<?php bloginfo('url'); ?>">
<h1>Sundry & Spirit</h1>
<h2>Burning Man Apparel</h2>
</a>
</div>
<div id="mainNav">
<?php wp_nav_menu(); ?>
</div>
</div>
</div>
And I've thrown some basic styling on this header for now, in the style.css file:
#header {
width: 100%;
height: auto;
background: #e1e1e1;
opacity: 0.75;
margin: 0 auto;
max-width: 960px;
}
#header-top {
height: 50px;
margin: 10px;
position: relative;
padding: 10px;
text-align: center;
}
HERE'S THE ANNOYING ISSUE: The basic header styling is not carrying over onto other pages, like http://sundryspirit.com/gallery/
How can that be if the header it just coming from a header.php file?! Thanks for your help -- my inexperience here is just driving me nutty.
Upvotes: 0
Views: 83
Reputation: 219938
You are using a relative URL to link to your stylesheet:
<link rel="stylesheet" href="wp-content/themes/sundry/style.css" />
Change it to an absolute URL:
<link rel="stylesheet" href="/wp-content/themes/sundry/style.css" />
^
or use get_stylesheet
.
Upvotes: 1