Header image and main navigation…
-
Self-hosted WordPress 3.5.1, using twentyeleven with child theme.
The twentyeleven theme’s header and main navigation width inherit the page width of 1000px.
The goal is to make the header and main navigation full width of the body; moving them above the page does the trick:
<body <?php body_class(); ?>>
<div id="header">
...
<nav id="access" role="navigation">
...
</nav>
</header>
<page>While it works, the header and the top navigation link are moved to the left, which is not desirable. The header image had been moved to the center in the child CSS, but experimenting with margins for the navigation link to reposition the link had been futile, due to the changes in browser window’s width changes.
It’s a kind of kludge work around, but this code does the trick:
<body <?php body_class(); ?>>
<div id="header">
...
<nav id="access" role="navigation"> </nav>
</header>
<page>
<nav id="access1" role="navigation">
...
</nav>
The “access1” division has a top margin of -50px, basically overlaying the division “access” that has the same background.
Removing the “<nav id=”access” role=”navigation”> </nav>” entry changes the header image height and location.
Is there a way to decouple the header and navigation divisions, basically a better way to achieve the desired goal?
TIA…
- The topic ‘Header image and main navigation…’ is closed to new replies.