Alguien puede revisar el codigo:

opzina · #1 (**permalink**) 02/03/2009, 16:18

Hola. estoy armando de a poquito esto: click aqui

Y necesitaria que alguien me puede ayudar con el codigo un poquito a depurarlo...ya que hay algunos errores (principalmente para ie.) y no puedo llegar a ver cuales son.

Principalmente el Css.

Desde ya muchas gracias.

html:

Código HTML:

<body>

<div id="contenedor">

<div id="header">

<div id="techo"></div>

<div id="header-1">

<div id="logo-left">

		<div id="logo-left-cont">

					<div id="image"><img src="img/logo.png" /></div>

		  <div id="subtxt">nutrición & salud</div>
</div>
</div>

<div id="logo-right"> 
			<div id="header-links">
    				<ul> 
     					 <li><a href="#">login</a> </li>
     					 <li><a href="#">registro</a> </li>
      					<li><a href="#">idioma</a> </li>
                            <li><a href="#">personalizar</a> </li>
                           <li><a href="#">sitemap</a> </li>
  						  </ul> 
</div>
</div>

</div>

</div>

<div class="wrapper"></div>

<div id="menu">

	<div id="menu-1"><img src="img/home.png" /></div>
    <div id="home">home</div>
    
<div id="menu-2"><img src="img/contacto.png" /></div>
<div id="contacto">contacto</div>
<div id="menu-3"><img src="img/turnos.png" /></div>
<div id="turnos">turnos</div>
<div id="menu-4"><img src="img/enlaces.png" /></div>
<div id="enlaces">enlaces</div>
<div id="menu-5"><img src="img/curriculum.png" /></div>
<div id="curriculum">curriculum</div>
</div>
<div class="wrapper"></div>


</div>



</body>

EL estilo CSS:

Código HTML:

@charset "utf-8";
/* CSS Document */

*{
margin: 0px;
padding: 0px;
}

BODY{
margin: 0px;
background:url(img/fondoindex.jpg) no-repeat;
font:100% Times New Roman, Times, serif;
color:#000000;
text-align:center;
}

a:link {
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: none;
}
a:active {
	text-decoration: none;
}

#contenedor
{
text-align:left;
width:80%;
margin: 0px auto;
}



#techo{
height:2px;
background:#FFCCFF;
width:100%;
}

#header{
height:100px;
background: #FF0099 url(img/fondo_header.png) repeat-x;
width:100%;
}

#logo-left{
float:left;
width:40%;
text-align:center;

}

#logo-left-cont{
position:relative;
left:100px;
}

#image{
float:left;
width:228px;
height:81px;
}

#subtxt{
float:left;
position:relative;
left:20px;
top:30px;
font:20px Arial, Helvetica, sans-serif;
width:150px;
height:20px;
}

#logo-right{
float:right;
width:50%;
}

#header-links{
width:20%;
position: relative;
left:290px;
font: small Verdana, Arial, Helvetica, sans-serif;
color:#CCCCCC;
margin-top:6px;
margin-bottom:3px;
}

.wrapper{
clear:both;
margin: 0px auto;
width:100%;
}

#menu{
width:100%;
background:#00FFFF;
height:214px;
background:#ffffff;
text-align:center;
}

#menu-1{
float: left;
width:20%;
}

#home{
	position:absolute;
	top:245px;
	left:197px;
	font: 25px Arial, Helvetica, sans-serif;
	color:#66FF66;
}

#menu-2{
float: left;
width:20%;
}

#contacto{
	position:absolute;
	top:245px;
	left:389px;
	font:25px Arial, Helvetica, sans-serif;
	color:#66FF66;
}

#menu-3{
float: left;
width:20%;
}

#turnos{
	position:absolute;
	top:245px;
	left:609px;
	font:25px Arial, Helvetica, sans-serif;
	color:#66FF66;
}

#menu-4{
float: left;
width:20%;
}

#enlaces{
	position:absolute;
	top:245px;
	left:806px;
	font:25px Arial, Helvetica, sans-serif;
	color:#66FF66;
}

#menu-5{
float: left;
width:20%;
}

#curriculum{
	position:absolute;
	top:247px;
	left:996px;
	font:23px Arial, Helvetica, sans-serif;
	color:#66FF66;

}

opzina · #2 (**permalink**) 03/03/2009, 09:23

algo lo acomode...

sin embargo...cuando hago zoom en + y en - se altera el contenido de la pagina.... es decir si en diferentes monitores habria diferentes resoluciones...el contenido se veria diferente....como soluciono esto..antes de seguir con el resto de la pagina??

saludos.

opzina · #3 (**permalink**) 03/03/2009, 11:57

Solcuionado.