MyBB Community Forums

Full Version: Search-form in header
You're currently viewing a stripped down version of our content. View the full version with proper formatting.

I am trying to copy the seach form in the header, like on this forum.

I have copied this and put into the header template, just before the >div class="menu">:
<div id="search">
					<form action="/search.php" method="post"><fieldset class="noborder"><label for="search_box"><span id="search_left"> </span></label><input name="keywords" id="search_box" title="Enter your search keywords" type="text" /><input value="Search Forum" name="submit-search" id="search_button" type="submit" /><input type="hidden" name="action" value="do_search" /></fieldset></form>

In global.css, I have copied the following:
div#search {
	top: 55px;
  right: -5px;
  height: 26px;
  position: absolute;
  display: inline-table;
  float: right;

span#search_left {
	background: url( no-repeat;
  cursor: text;
  width: 3px;
  height: 26px;
  display: block;
  position: relative;
  float: left;
  top: 0;
  font-size: 2px;

input#search_box {
	background: #fff url( 5px no-repeat;
  border: 1px solid #024570;
  border-left: 0;
	font-family: Tahoma, 'Trebuchet MS', Arial, sans-serif;
  padding: 5px;
  padding-left: 25px;
  width: 150px;
	height: 14px;
	float: left;
	top: 0;

input#search_button {
	background: url( 100% 0% no-repeat; 
	font-family: Tahoma, 'Trebuchet MS', Arial, sans-serif;
	color: #fff;
	border: 0;
	padding: 4px 6px 4px 6px;
	float: left;
	top: 0;
	width: 99px;
	height: 26px;
	cursor: pointer;

input#search_button:hover {
	background-position: 100% 100%;

The result looks like this:

Live demo:

Can anyone tell me how to get it to fit ? And get it a little bit higher so it is not on top of the menu.
in the global.css , for the element div#search , change top: 55px; to top: 25px; and right: -5px; to right: 75px; and save global.css
if your browser doesn't show the changes then hard refresh page once or twice (press CTRL + F5)
Thank you!! Smile Smile Looks really nice now, just what i wanted!