Search Form in Brand Nav

[alisamski+ 9]

Found this for Platform Pro... and it does not work in Frameworks..

#header .searchform{
	position:absolute;
	right:10px; /*increase this number to move the form to the left*/
	bottom:20px; /*increase this number to move the form up and into the branding area*/
	}

Also swapped out #header for #brandnav but that didn't work either.. Any suggestion on how to?

[mackenzie 12]

Are you looking to put the search in the same section as the main menu "brandnav-nav main_nav fix"?

[alisamski+ 9]

If you go to the link... I'm looking to put it in the upper right hand corner of the area... can be aligned with the nav or above... so not sure of the section... or the css at this point.

[catrina 103]

Is your search bar enabled right now (I can't find anywhere on the page or in your source code)? The CSS selectors need to be changed in order to work properly on Framework.

[alisamski+ 9]

In my header templates... I have Brand Nav... didn't have Navigation in there... Search bar is enabled. I added the Navigation in the template now... but hidden by default.. Does that help?

[Rob 547]

Alisamski, Can you not simply place the nav above your graphic (the animated gif is soo cool, btw), then align the menu right by adding a margin left? If we had the actual menu that contains the search present, it might help us. Also, if we move the search up, we will need to adjust its z-index most likely.

[alisamski+ 9]

Started by having the regular nav under header... however realized that we needed to use the brand nav... in order to have the nav above anything in that area... the anim is upload via the "logo" area so we have an actual link there... not sure of how else to do it and still accommodate the "img logo link"... Are you saying we can have the regular navigation along with its search bar and move it above the logolink in the header?

[Rob 547]

Alisamski, In Dashboard > PageLines > Templates under Header, you should be able to drag the "Navigation" section over. Place it above the Branding. You'll have a menu, with search engine above the image. Let me know if it works for you.

[alisamski+ 9]

ok... will mess with it and let you know what happens..

[Rob 547]

Great. It should be really easy to test.

[alisamski+ 9]

OK... I know why I used the brand nav... because I started out the way you suggested.... and tried to move the nav over with a margin-left... however, the background for the nav stayed white... and covered my "header" art... I could not for the life of me find how to get rid of that nav background in firebug... I will put in place once again and if you can help with the css mods I'd appreciate it...

[Rob 547]

In your navigation CSS, you'll want to add [code] background: none repeat scroll 0 0 rgba(255, 255, 255, 0.10);[/code] which gives you 10% opacity. If you want none, set it to 0.0. You might need to simply adjust the height or margin-top for the branding. It should be fairly easy.

[alisamski+ 9]

wow. I was able to get the nav over fairly easy... however I'm having some image gaps in the header art and sidebar art... you can see the gap in the shadow of the art. So Im adding quite a bit of css to see what needs to move around...

[Rob 547]

There appears to be some padding around one of the branding related elements which I can't find. It's pushing the content area down, creating the gap. Unfortunately, my skills are not quite good enough to identify it. However, I'll shoot a message to one of my colleagues with much better CSS skills to ask them to take a look.

[alisamski+ 9]

We've been fussing with it... and seem to have it in place... not sure what the heck we did... but it seems to be working... phew! a combo of 5 different css mods!

[Rob 547]

Good things take work!

[alisamski+ 9]

good answer! Thanks for your help thru it all!