MyBB Community Forums

Hi!

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>
				</div>

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(http://mybboard.net/assets/images/search_left.gif) 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(http://mybboard.net/assets/images/search.png) 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(http://mybboard.net/assets/images/search_button.gif) 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:
[attachment=29528]

Live demo: http://alopeci.info

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!! Looks really nice now, just what i wanted!