Search bar on top right of my .nav

• 

  onemaxbaker · Member · Jul 17, 2015 at 4:18 am

  • Copy link
  • Add topic to favorites

  Hello.

  I would like to be able to put my search bar at the absolute right of my menu. Worst case absolute right of my header.

  Thank you

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Jul 18, 2015 at 4:16 am

  • Copy link

  Hi there, give the following a try. What I have done is to use a Media Query to limit this change to screens/browser window widths of 768px and wider. The reason for this is that at 768px and narrower the theme adjusts position and size of the page elements and the header then overlaps the search box.

  @media screen and (min-width: 768px) {
  	#searchform {
  		width: 200px;
  		float: right;
  		margin-top: 40px;
  	}
  	.container {
  		top: -90px
  	}
  }

• 

  onemaxbaker · Member · Jul 19, 2015 at 2:20 am

  • Copy link

  Sir, you are a genius. Many answered me that it wasn’t possible.

  Thank you so much. :)

• 

  onemaxbaker · Member · Jul 19, 2015 at 2:21 am

  • Copy link

  Ha.

  It works, but the search itself doesn’t :(

• 

  onemaxbaker · Member · Jul 19, 2015 at 2:27 am

  • Copy link

  This is exactly what I want though. When I click on it, it seems to be reloading my page in a weird way. Could you take a look please?

  Many thanks

• 

  onemaxbaker · Member · Jul 19, 2015 at 2:36 am

  • Copy link

  Actually it takes me back to the home page when i click on it

• 

  thesacredpath · Member · Jul 19, 2015 at 6:50 am

  • Copy link

  Oops, sorry, change the code I gave you to this.

  @media screen and (min-width: 768px){
  	#searchform{
  		width:200px;
  		float:right;
  		margin-top:40px
  	}
  
  	.container{
  		top:-90px
  	}
  	.sb-widget {
  		position: relative;
  		z-index: 10;
  	}
  }