JSFiddle - React, Tailwind, and code Playground
HTML
<html>
<head>
<title>TEST</title>
<!-- http://artgorbunov.ru/bb/soviet/20121213/ and http://habrahabr.ru/post/162841/ -->
<meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
<style type="text/css">
body {
}
#content {
padding-top: 100px; /* отбиваем высоту баров, чтобы не перекрывать контент вверху страницы */
}
#nav_top {
}
#nav_top_2 {
}
</style>
</head>
<body style="
margin: 0px;
">
<div id="nav_top" style="
position: fixed;
left: 0;
top: 0;
width: 100%;
/* height: 25px; фиксируем высоту topbar'а для простоты */
background: #eee;
z-index: 100;
">
<div style="float: left;">Fixed Title Главная Меню Форум Темы ТОП-пользователей Fixed Title Главная Меню Форум Темы ТОП-пользователей</div>
<div style="float: right;">Fixed Title Войти Выход Сообщения Мои темы Профиль Закладки Поиск Ещё Fixed Title Войти Выход Сообщения Мои темы Профиль Закладки Поиск Ещё</div>
<div id="nav_top_2" style="
position: fixed;
background: #eee;
border: 1px solid lightgrey;
border-top-width: 0px;
margin: 30px 25% 0 25%;
width: 50%;
z-index: 1000;
">
<div style="
margin: 0;
/* нужно центрировать эти элементы: */
">
<form id="quick-search" action="" method="post" onsubmit="
$(this).attr('action', $('#search-action').val());
var txt=$('#search-text').val(); return !(txt=='Введите текст для поиска' || !txt);
">
<input type="hidden" name="max" value="1">
<input type="hidden" name="to" value="1">
<input id="search-text" style="position: relative; width: 60%; background-image: url(http://dl.dropbox.com/u/140879/test/img/search.png); background-color: rgb(255, 255, 255); padding-left: 17px; background-position: 1px -1px; background-repeat: no-repeat no-repeat;" type="text" name="nm" x-webkit-speech="x-webkit-speech" value="Введите текст для поиска" onfocus="this.style.backgroundColor='#F0F0F0';this.value='';"...