Foros del Web

Foros del Web (http://www.forosdelweb.com/)
-   CSS (http://www.forosdelweb.com/f53/)
-   -   (Consulta) Correccion codigo CSS (http://www.forosdelweb.com/f53/consulta-correccion-codigo-css-597551/)

opzina 17/06/2008 17:49
(Consulta) Correccion codigo CSS
 
Hola, necesitaria saber si se puede optimizar y/o mejorar este css. (creo que en IE6) se ve mal.


body {
margin : 0 auto;
padding : 0;
width : 802px;
height : 130px;
position : relative;
background-image : url(../imagenes/fondo_textura_verde.png);
}
#todo {
margin : 0;
padding : 0;
border : 1px solid #000000;
}
#login {
margin : 0;
padding : 0;
position : absolute;
top : 3px;
left : 3px;
font-family : Calibri;
font-size : 12px;
}
#menu {
position : absolute;
top : 105px;
left : 20%;
margin : 0;
padding : 0;
font-family : Calibri;
font-size : 18px;
}
#header {
border-bottom : 1px solid #000000;
margin : 0 auto;
padding : 0;
width : 802px;
height : 130px;
}
#cuerpo {
min-height : 400px;
height : auto;
background-color : #ffffff;
margin : 0 auto;
padding : 50px;
position : relative;
}
#footer {
border-top : 1px solid #000000;
margin : 0 auto;
padding : 0;
background-color : #ffdfff;
}
#menu2 {
margin : 0 auto;
padding : 0;
font-family : Calibri;
font-size : 12px;
}

es de esta pagina: http://www.nutrimel.com.ar le puse al body width 802 pq sino no me tomaba el borde de la derecha.
saludos

opzina 18/06/2008 08:32
Respuesta: (Consulta) Correccion codigo CSS
 
alguien q pueda ayudarmee!!!

:-)

DragonX 18/06/2008 08:49
Respuesta: (Consulta) Correccion codigo CSS
 
Probá con esto:

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=utf-8" />
<title>Bienvenidos | nutrimel.com.ar</title>
<style>
*{
  padding:0;
  margin:0;
}

body {
margin : 0 auto;
width : 802px;
height : 130px;
position : relative;
background-image : url(../imagenes/fondo_textura_verde.png);
}
#todo {
border : 1px solid #000000;
}
#login {
position : absolute;
top : 3px;
left : 3px;
font-family : Calibri;
font-size : 12px;
}
#menu {
position : absolute;
top : 105px;
left : 20%;
font-family : Calibri;
font-size : 18px;
}
#header {
border-bottom : 1px solid #000000;
width : 802px;
height : 130px;
}
#cuerpo {
min-height : 400px;
height : auto;
background-color : #ffffff;
padding : 50px;
position : relative;
}
#footer {
border-top : 1px solid #000000;
background-color : #ffdfff;
}
#menu2 {
font-family : Calibri;
font-size : 12px;
}
</style>
<!--[if lt IE 7.]>
<script defer type="text/javascript" src="http://www.nutrimel.com.ar/includes/pngfix.js"></script>
<![endif]-->
</head>
<body>

<div id="todo">

<div id="header"><img src="../imagenes/header.png" />

<table id="login">
  <tr>
    <td><a href="?mod=login">iniciar sesión</a></td>
    <td>|</td>
    <td><a href="?mod=registro">registrarse</a></td>
  </tr>
</table>
<table id="menu" >
  <tr>

    <td><a href="?mod=home">inicio</a></td>
    <td>&nbsp;</td>
    <td>|</td>
    <td>&nbsp;</td>
    <td><a href="?mod=contacto">contacto</a></td>
    <td>&nbsp;</td>
    <td>|</td>

    <td>&nbsp;</td>
    <td>turnos</td>
    <td>&nbsp;</td>
    <td>|</td>
    <td>&nbsp;</td>
    <td><a href="?mod=nutriblog">nutriblog</a></td>
    <td>&nbsp;</td>

    <td>|</td>
    <td>&nbsp;</td>
    <td><a href="?mod=actualidad">actualidad</a></td>
    <td>&nbsp;</td>
    <td>|</td>
    <td>&nbsp;</td>
    <td>links</td>

  </tr>
</table>

</div>

<div id="cuerpo" align="center">
<div id="fila1" style="width:33%; position:absolute; top:50px; left:2%">
<div id="celda 1" style="margin:0px; padding:0px; background-color: #ffedd4; border-top:2px solid #ffb03f; border-left:1px dotted #d3d3d3; border-right:1px dotted #d3d3d3; font-family:Calibri; font-size:16px; text-align:center;">Encuestas</div>
<div id="celda 2" style=" border-left:1px dotted #d3d3d3;  border-right:1px dotted #d3d3d3; font-family:Calibri; font-size:12px; text-align:left; ">encuesta</div>
<div id="celda 2" style=" margin:0px; padding:0px; border-left:1px dotted #d3d3d3; border-right:1px dotted #d3d3d3; border-bottom:1px solid #d3d3d3; border-top:1px dotted #d3d3d3; background-color: #e4efff; font-family:Calibri; font-size:12px; text-align:center;">encuesta</div>
</div>

<div id="fila2" style="width:34%; position:absolute; top:50px; left:67%">
<div id="celda 3">div 1</div>
<div id="celda 4">div 2</div>
</div>

<div id="fila3" style="width:60%; position:absolute; top:250px; left:20%">
<div id="celda 1" style="margin:0px; padding:0px; background-color: #c2e4b3; border-top:2px solid #007F00; border-left:1px dotted #d3d3d3; border-right:1px dotted #d3d3d3; font-family:Calibri; font-size:16px; text-align:center;">Últimos post | nutriblog</div>
<div id="celda 2" style=" border-left:1px dotted  #d3d3d3;  border-right:1px dotted  #d3d3d3; font-family:Calibri; font-size:12px; text-align:left; "><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     
    12 de Junio  |
    7mo post, renovación de la cartelera
    <br/>

 
    12 de Junio  |
    Llegamos el 6to post, este es el ultimo que se publica
    <br/>
 
    12 de Junio  |
    El libro que estoy leyendo se llama el principe de Maquiavelo
    <br/>
 
    12 de Junio  |
    Mañana pasan a buscar el lcd creo q al mediodia, vendran???
    <br/>
 
    12 de Junio  |
    Probando otro post para la organizacion del organizer en el index
    <br/>
 
    12 de Junio  |
    Probando wordpress y posts en index.
    <br/>

</div>
<div id="celda 3" style=" margin:0px; padding:0px; border-left:1px dotted  #d3d3d3; border-right:1px dotted #d3d3d3; border-bottom:1px dotted  #d3d3d3;border-top:1px dotted #d3d3d3; background-color: #e4efff; font-family:Calibri; font-size:12px; text-align:center;"><a href="?mod=nutriblog">nutriblog</a></div>
</div>

</div>

<div id="footer">
<table id="menu2" >
  <tr>
    <td><a href="?mod=home">inicio</a></td>

    <td>&nbsp;</td>
    <td>|</td>
    <td>&nbsp;</td>
    <td><a href="?mod=contacto">contacto</a></td>
    <td>&nbsp;</td>
    <td>|</td>
    <td>&nbsp;</td>

    <td>turnos</td>
    <td>&nbsp;</td>
    <td>|</td>
    <td>&nbsp;</td>
    <td><a href="?mod=nutriblog">nutriblog</a></td>
    <td>&nbsp;</td>
    <td>|</td>

    <td>&nbsp;</td>
    <td><a href="?mod=actualidad">actualidad</a></td>
    <td>&nbsp;</td>
    <td>|</td>
    <td>&nbsp;</td>
    <td>links</td>
    <td>&nbsp;</td>

    <td>|</td>
    <td>&nbsp;</td>
    <td><a href="?mod=login">login</a></td>
    <td>&nbsp;</td>
    <td>|</td>
    <td>&nbsp;</td>
    <td><a href="?mod=registro">registrarse</a></td>

    <td>&nbsp;</td>
    <td>|</td>
    <td>&nbsp;</td>
    <td>newsletter</td>
    </tr>
  <tr>
    <td colspan="16">&nbsp;</td>
    <td>&nbsp;</td>

    <td colspan="16">&nbsp;</td>
    </tr>
  <tr>
    <td colspan="33" align="center">Copyright © 2008 Nutrimel.com.ar Todos los derechos reservados | Disclaimer</td>
    </tr>
</table>

</div>

</div>

</body>
</html>
Tu código HTML era un desastre, tenias 3 tags de body, tres de Head y otros desastres :si:

Fijate y decinos :adios:

opzina 18/06/2008 11:10
Respuesta: (Consulta) Correccion codigo CSS
 
Hola, gracias por responder....

Bueno lo de los 3 heads y 3 bodys...puede deberse a q se cargan modulos y por eso en el codigo se vean todos los head???...cmo solucionarlo??

cdo termine la pagina todos los estilos van a ir en un archivo aparte..

el codigo q pusiste..se ve bien en el browser, mal en el dreamweaver (aunq aca nadie navega) y tb los links no funcionan...


saludos.

opzina 18/06/2008 11:11
Respuesta: (Consulta) Correccion codigo CSS
 
si queres te paso el html del layout de la web modular.....(ya q el css q pase al pricipio es de del layout)...decime y lo cargo...


La zona horaria es GMT -6. Ahora son las 07:45.

Desarrollado por vBulletin® Versión 3.8.7
Derechos de Autor ©2000 - 2026, Jelsoft Enterprises Ltd.