Hola a todos.
Tengo un contenido web que estoy empezando a crear. La página de inicio
Consta de:
<div id="contenedor">
<div id="cabecera">
<div id="Logotipo"></div>
<div id="conrtmenu">
<div id="menuIni">inicio</div>
<div id="menuCV"> C. V</div>
<div id="menuBook"> Book</div>
<div id="menuContac">Contacto></div>
</div>
<div id="contCuerpo">
<div id="contSlider"></div>
<div id="AnagramaBienvenida"></div>
<div id="Biemvenida"><h1>Bienvenidos</h1></div>
</div>
</div>
todo va bien hasta que hago la siguiente página la de curriculum.
Para esto hice una plantilla de la primer y deje como region editable el
<div id="contCuerpo">
Guardo la plantilla y creo un documento nuevo desde plantilla y lo guardo.
Dentro del div “contCuerpo” creo un div para separar la cabecera del cuerpo y lo llamo
<div class="FranjaCurriculum" id="FranjasColor"></div>
Luego creo otro div para colocar dentro una tablas
<div id="contTabla">
y detro de esta una tabla de 9 filas y 3 columnas
<table width="950" border="0" cellspacing="0" cellpadding="0">
al final de l todo lo cierrro con un div pié
HTML página Curriculum:
<div id="contenedor">
<div id="cabecera">
<div id="Logotipo"></div>
<div id="conrtmenu">
<div id="menuIni">inicio</div>
<div id="menuCV"> C. V</div>
<div id="menuBook"> Book</div>
<div id="menuContac">Contacto></div>
</div>
<div id="contCuerpo">
<div id="FranjasColor"></div>
<div id="contTabla">
<table width="950" border="0" cellspacing="0" cellpadding="0">
</div>
</div>
</div>
Cual es el problema.
Cuando dentro del div contCuerpo coloco bien una tabla como en este caso o bien un <iframe> si su altura supera los 750 px cuando lo visualizo en firefox y en safari al pinchar en el botón de curriculum, para abrir esa pg estando en la pg de inicio, se ve como se mueve un poco a la izquierda todo el contenido web.
Estuve haciendo pruebas y si pongo menos altura al div contCuerpo por ejemplo 600 px ese efecto no sucede.
Alguien me podría decir algo Gracias.
Estuve mirando tambien algun tema relacionado por la web y algo parecido es un tema de al hacer zoom se desplaza el contenedor. es algo parecido ya que probe a disminuir el tamaño en mi navegador y no se aprecia esa diferencia. pero es logico al estar mas pequeño el movimiento es menor
estoy un poco liado con esto y quisiera saber cual es la solucion
CSS
body {
background-color: #DFDFDF;
text-align: center;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
/*Contenedor Principal de la Pg*/
#contenedor {
width: 1000px;
margin-right: auto;
margin-left: auto;
}
/*Comienzo de Cabecera con Logotipo y Menus*/
#cabecera {
height: 187px;
width: 1000px;
background-color: #FFF;
float: left;
}
#conrtmenu{
width: 326px;
text-align: center;
line-height: 33px;/*para alinear al centro texto en altura*/
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
float: right;
display: block;
color: #666;
padding-top: 75px;
padding-right: 80px;display: block;
}
#contCuerpo{
width: 1000px;
background-color: #FFF;
float: left;
}
/*————––––––––––––––––––––––––––––––––––––––––––––– –––––––––––––*/
/*Comienzo Estilos de la Página Curriculum */
#FranjasColor{
height: 10px;
width: 1000px;
top: 0px;
float: left;
}
.FranjaCurriculum {
background-color: #F00;
}
/*para colocar la tabla del curriculum*/
/*estilo fododegra para el fondo que va degradadod de la pg curriculum*/
#contTabla{
height:750px; /*Aqui Si pongo 650 px no sucede lo del desplazamiento*/
width: 1000px;
margin-top: 0px;
margin-bottom: 0px;
background-image: url(../img/Curriculum/fondodegra.gif);
background-repeat: repeat-x;
background-position: 0px 0px;
float: left;
}
/*————––––––––––––––––––––––––––––––––––––––––––––– –––––––––––––*/
/*estilo para la tabla*/
table {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #666;
/*height: 100%;*/
margin-top: 0px;
margin-right: auto;
margin-left: auto;
padding: 0px;
margin-bottom: 10px;
}
#table, h1{
color: #FFF;
text-align: center;
}
.h1ExperienciaLaboral {
color: #333;
}
#table, th, td{
height: auto;
margin-top: 0px;
vertical-align: top;
}
/*————––––––––––––––––––––––––––––––––––––––––––––– –––––––––––––*/
/*Comienzo pg Book*/
#contieneiframe{
float: left;
width: 650px;
}
.iframene{
height: 950px;
width: 1000px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
background-color: #F00;
}
/*————––––––––––––––––––––––––––––––––––––––––––––– –––––––––––––*/
/*Comienzo piek*/
#pie{
background-color: #333;
height: 15px;
width: 1000px;
margin-top: 10px;
float: left;
}