The problem is because of your use of position absolute. Copy and paste the following into a new document and view in your favourite browser.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet">
<style>
html {
background: #FFF url(degradado_base_conica_rejilla.png) repeat-x;
height: 100%;
}
body {
width: 980px;
margin: auto;
}
.buscador {
width: 290px;
float: right;
font-size: 14px;
font-weight: bold;
color: #CC3300;
margin-top: 25px;
}
.nav {
height: 35px;
}
ul.MenuBarHorizontal li {
width: auto;
}
ul.MenuBarHorizontal ul {
width: auto;
}
ul.MenuBarHorizontal ul li {
display: block;
float: none !important;
width: auto;
white-space: nowrap;
border-bottom: solid 1px #EEE;
}
ul.MenuBarHorizontal a.MenuBarItemSubmenu {
padding: 0.5em 2em 0.5em 0.75em;
}
.bandera {
margin-top: 40px;
}
</style>
</head>
<body>
<div class="buscador">
<script>
<!-- Begin
var item = new Array();
// "Nombre de la página","Situación página","Título","Palabras clave","Comentarios descriptivos"
/* links below were changed so a 404 error would not be found if someone actually clicked them in the www.js-examples.com database */
c=0; item[c]=new Array("/","","Página de prueba","índice, principal, home, primera","Demostración de un buscador intento en un web imaginario.");
c++; item[c]=new Array("/","","Sobre el autor","sobre, about, autor, contactar, correo, email","Detalles de contacto e información general sobre el creador del site y sobre su contenido.");
c++; item[c]=new Array("/","","Página de enlaces","enlaces, links, más, amigos, detalles","Enlaces a páginas de contenido similar. Páginas amigas interesantes.");
c++; item[c]=new Array("/","","Página principal","contenido, principal, foco","La parte principal del web que contiene cantidad de material útil. Todo en el mismo subdirectorio.");
c++; item[c]=new Array("/","","Logo de la página","enlace, imagen, gráfico","El logo en jpg es simplemente una pequeña imagen que puedes poner en tu web para enlazar a esta página.Está en un directorio de segundo nivel.");
page="<html><head><title>Search Results</title></head><body bgcolor='white'><center><table border=0 cellspacing=10 width=80%>";
function search(frm) {
win = window.open("","","scrollbars");
win.document.write(page);
txt = frm.srchval.value.split(" ");
fnd = new Array(); total=0;
for (i = 0; i < item.length; i++) {
fnd[i] = 0; order = new Array(0, 4, 2, 3);
for (j = 0; j < order.length; j++)
for (k = 0; k < txt.length; k++)
if (item[i][order[j]].toLowerCase().indexOf(txt[k]) > -1 && txt[k] != "")
fnd[i] += (j+1);
}
for (i = 0; i < fnd.length; i++) {
n = 0; w = -1;
for (j = 0;j < fnd.length; j++)
if (fnd[j] > n) { n = fnd[j]; w = j; };
if (w > -1) total += show(w, win, n);
fnd[w] = 0;
}
win.document.write("</table><br>Total ocurrencias: "+total+"<br></body></html>");
win.document.close();
}
function show(which,wind,num) {
link = item[which][1] + item[which][0];
line = "<tr><td><a href='"+link+"'>"+item[which][2]+"</a> encontrados: "+num+"<br>";
line += item[which][4] + "<br>"+link+"</td></tr>";
wind.document.write(line);
return 1;
}
// End -->
</script></p>
<form action="javascript:void(0)" method=get class="buscador" id="buscador" onSubmit="search(this); return false;">
<label for="srchval">Buscador:</label>
<input name=srchval type=text size="20" maxlength="50">
<input type=submit value="Buscar">
</form></div>
</div>
<br style="clear:both;">
<div class="nav">
<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a class="MenuBarItemSubmenu" href="#">Nosotros</a>
<ul>
<li><a href="#">Quienes somos</a></li>
<li><a href="#">Medios Humanos</a></li>
<li><a href="#">Medios Materiales</a></li>
<li><a href="#">Localización</a></li>
</ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">A que nos dedicamos</a>
<ul>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">Elemento sin título</a></li>
</ul>
</li>
<li><a class="MenuBarItemSubmenu" href="#">Clientes</a>
<ul>
<li><a href="#">5</a></li>
<li><a href="#">7</a></li>
<li><a href="#">Elemento sin título</a></li>
</ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Elemento 4</a>
<ul>
<li><a href="#">6</a></li>
<li><a href="#">7</a></li>
<li><a href="#">8</a></li>
<li><a href="#">Elemento sin título</a></li>
</ul>
</li>
</ul>
</div>
<div class="bandera">
<object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="980" height="300">
<param name="movie" value="carrousel/carrousel.swf">
<param name="wmode" value="opaque">
<param name="swfversion" value="11.0.0.0">
<!-- Esta etiqueta param indica a los usuarios de Flash Player 6.0 r65 o posterior que descarguen la versión más reciente de Flash Player. Elimínela si no desea que los usuarios vean el mensaje. -->
<param name="expressinstall" value="Scripts/expressInstall.swf">
<!-- La siguiente etiqueta object es para navegadores distintos de IE. Ocúltela a IE mediante IECC. -->
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="carrousel/carrousel.swf" width="980" height="300">
<!--<![endif]-->
<param name="wmode" value="transparent">
<param name="swfversion" value="11.0.0.0">
<param name="expressinstall" value="Scripts/expressInstall.swf">
<!-- El navegador muestra el siguiente contenido alternativo para usuarios con Flash Player 6.0 o versiones anteriores. -->
<div>
<h4>El contenido de esta página requiere una versión más reciente de Adobe Flash Player.</h4>
<p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Obtener Adobe Flash Player" width="112" height="33"></a></p>
</div>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>
</div>
<script src="Scripts/swfobject_modified.js"></script>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</body>
</html>
Notice that position has not been used in the CSS
Gramps
