I am trying to move the search container to the navigation bar in the Seasons theme. I would like the search bar to be inline with the navigation items. In themes/seasons/common/header.php, I have tried moving the <div id="search container" role="search" to various places within the <nav> section, and have only been partially successful - I can move the search container into the nav bar but can't get it inline with the navigation items.
I'm reaching the end of my technical know-how. Does anyone have any ideas? Thanks!
Move the search container
div right after
<?php echo public_nav_main; ?>. Then check the CSS and make sure
#search-container has the same margins and padding as
nav.top ul li a
For me, my #search-container CSS has to have these values to be inline with the menu items:
padding: .75em 16px;
margin-left: -1em; /* search sits below nav without this */
I use a heavily customized version of Seasons, so your values will likely be different.
Thanks, sheepeeh. I have been playing around with your advice, and am not having any luck getting the search container to appear on the same level as the other navigation items without losing the ability to use the search form. Perhaps what I am after is not possible.
Is the site publicly available? Beyond what I've said, it's hard to troubleshoot without looking at it.
The site is available, pccaomeka.wrlc.org though I have just begun setting it up and adding theming, so there isn't much in there yet. Thanks for your help so far, it is greatly appreciated.
I have no idea why this is the case, but I think I've narrowed down the problem. Change the
display for both
nav.top nav.menu to
inline-block. For whatever reason, negative margins are breaking the search otherwise.