buenas!
estoy armando una pagina y cuando la pruebo en explorer 6 y 7 y bajo se me va todo muy hacia abajo del pie de pagina. ya antes habia echo cosas similares de la misma forma y nada pasa pero en este si y no logro captar que sera.
les dejo los codigos
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin título</title>
<link href="estilorest.css" rel="stylesheet" type="text/css" />
<!-- include jQuery library -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<!-- include Cycle plugin -->
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.2.74.js"></script>
<!-- initialize the slideshow when the DOM is ready -->
<script type="text/javascript">
$(document).ready(function() {
$('#bannersgds').cycle({
fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
,
speed: 1000,
timeout: 6000
});
});
</script>
</head>
<body>
<div id="maincontainer">
<div id="topsection"><img src="../Nueva carpeta (3)/images/cabecera.jpg" />
<ul class="menuholder">
<li class="menu_inicio"><a href="#" title="home" ></a></li>
<li class="menu_acerca"><a href="#" title="about us"></a></li>
<li class="menu_menu"><a href="#" title="menu"></a></li>
<li class="menu_localidad"><a href="#" title="location"></a></li>
<li class="menu_reservacion"><a href="#" title="reservations"></a></li>
<li class="menu_contacto"><a href="#" title="contact us"></a></li>
<li class="menu_idioma"><a href="#" title="spanish"></a></li>
</ul>
</div>
<div id="contentwrapper">
<div id="contentcolumn">
<div class="innertube">
<img src="images/bienven.jpg" />
<div id="bannersgds">
<img src="images/jq1.jpg" width="500" height="261" />
<img src="images/jq2.jpg" width="500" height="261" />
<img src="images/jq3.jpg" width="500" height="261" />
<img src="images/jq4.jpg" width="500" height="261" />
</div>
<div class="est1">Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per.</div>
<img src="images/prest1.jpg" />
</div>
</div>
</div>
</div>
<div id="leftcolumn">
<div class="innertube">
<img src="../Nueva carpeta (3)/images/column izq.jpg" />
</div>
</div>
<div class="clearfooter"></div>
<div id="footer"><img src="../Nueva carpeta (3)/images/pie.jpg" /></div>
</div>
</body>
</html> Código HTML:
/* CSS Document */
html, body, div, span,
applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dd, dl, dt, li, ol, ul,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
line-height: 1;
font-family: inherit;
text-align: left;
vertical-align: baseline;
}
a img, :link img, :visited img {
border: 0;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
ol, ul {
list-style: none;
}
q:before, q:after,
blockquote:before, blockquote:after {
content: "";
}
body{background-color:#000000;
}
#maincontainer{
width: 1010px; /*Width of main container*/
margin: 0 auto; /*Center container on page*/
}
#topsection{
background: #000;
height: 165px; /*Height of top section*/
}
#topsection h1{
margin: 0;
padding-top: 15px;
}
#contentwrapper{
float: left;
width: 100%;
}
#contentcolumn{
margin-left: 300px; /*Set left margin to LeftColumnWidth*/
}
.est1 {
margin:70px 110px 0 50px;
color:#F49528;
}
.est2 {
margin:30px 100px 0 50px;
color:#F49528;
}
#bannersgds img {
margin:50px 0 0 50px;
}
#leftcolumn{
float: left;
width: 300px; /*Width of left column*/
margin-left: -1010px; /*Set left margin to -(MainContainerWidth)*/
background: #C8FC98;
}
#footer{
clear: left;
width: 100%;
background: black;
color: #FFF;
text-align: center;
padding: 4px 0;
}
.innertube{
margin: 10px; /*Margins for inner DIV inside each column (to provide padding)*/
margin-top: 0;
}
/*menu*/
.menuholder li {float:left;}
.menuholder a {background:url(images/menusprite.jpg);display:block; height:35px; text-indent:-9000%}
/*ESTADO NORMAL*/
.menu_inicio a {width:110px;}
.menu_acerca a {width:130px; background-position:-110px 0px;}
.menu_menu a {width:130px; background-position:-240px 0px;}
.menu_localidad a {width:165px; background-position:-370px 0px;}
.menu_reservacion a {width:165px; background-position:-535px 0px;}
.menu_contacto a {width:140px; background-position:-700px 0px;}
.menu_idioma a {width:140px; background-position:-840px 0px;}
/*ESTADO ROLLOVER*/
.menu_inicio a:hover {background-position:0px -35px;}
.menu_acerca a:hover{background-position:-110px -35px;}
.menu_menu a:hover {background-position:-240px -35px;}
.menu_localidad a:hover {background-position:-370px -35px;}
.menu_reservacion a:hover {background-position:-535px -35px;}
.menu_contacto a:hover {background-position:-700px -35px;}
.menu_idioma a:hover {background-position:-840px -35px;}
/*menu*/
#maincontainer #contentwrapper #contentcolumn .innertube img {
margin:50px 0 0 50px;
}