Estoy tratando de agregar una caja de busqueda en el theme que estoy diseñando, pero no se ubica correctamente, del sitio donde lo saque dice que puede tener problemas si se encuentra dentro de elementos flotantes dando un link donde tiene tutoriales para solucionar pero no he encontrado la solucion todavia...
el sitio es este
Código:
http://blog.reindel.com/2007/08/13/howto-spruce-up-your-search-box-with-css-and-a-background-image/
mi html es el siguiente:
Código:
<div class="encabezado">
<div class="enc_izq"><a href="{$mybb->settings['bburl']}/index.php"><img src="{$theme['logo']}" alt="{$mybb->settings['bbname']}" /></a></div>
<div class="enc_der">
<div id="search_box">
<form id="search_form" method="post" action="{$mybb->settings['bburl']}/search.php">
<input type="text" id="s" value="Search" class="swap_value" />
<input type="hidden" name="action" value="do_search" />
<input type="hidden" name="postthread" value="1" />
<input type="hidden" name="forums" value="all" />
<input type="hidden" name="showresults" value="threads" />
<input type="image" src="{$theme['imgdir']}/btn_search_box.gif" width="27" height="24" id="go" alt="Search" title="Search" />
</form>
</div>
<br />
<img src="{$theme['imgdir']}/sis.gif" alt="xalt" />
</div>
</div>
mi css es el siguiente:
Código:
.encabezado {
background: #70BC32 url(images/pwe09/head_bg.png) center center repeat-x;
overflow: hidden;
margin: 0;
padding: 0;
}
.enc_izq {
float: left;
margin: 0;
padding: 20px;
text-align: left;
}
.enc_der {
float: right;
height: 100%;
margin: 0;
padding: 20px;
vertical-align: bottom;
display: inline;
overflow: hidden;
text-align: right;
}
#search_box {
width: 201px;
height: 31px;
background: url(images/pwe09/bg_search_box.gif);
overflow: hidden;
}
#search_box #s {
float: left;
padding: 0;
margin: 6px 0 0 6px;
border: 0;
width: 159px;
background: none;
}
#search_box #go {
float: right;
margin: 3px 4px 0 0;
}
probe con clear: both, overflow: hidden... etc, pero nose donde radica el problema...
desde ya muchas gracias y feliz año nuevo