ROYGES escribió:Raulyure
Primero que nada quería agradecerte mucho el que te tomes tu tiempo en ayudarme y que soy un completo novato en esto.
Hice lo que ud me dijo de poner el "P","H1"y"H2" antes del "Body"
y de agregar el "clear:both" al pie y ahora se ve un poco mejor.
Ahora lo de validar yo ni siquiera sabia que existía y me di cuenta de la validación buscando la solución a mi problema y lo que hice para validar fue agregar esta linea:
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
a mi HTML
por cierto
Bueno no me extenderé mas con esto que seguro que le aburriré.
Créame no me aburrirá para nada,todo lo contrario lo que quiero es aprender y por eso estoy aquí
vuelvo a poner mi HTML y CSS por si me le puede echar otro vistazo
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
<script type="text/javascript" src="niftycube.js"></script>
<script type="text/javascript">
window.onload=function()
{
Nifty("div#fondo")
Nifty ("div#cabecera,div#pie","small")
Nifty ("div#menu,div#contenido","same-height")
Nifty("ul.postnav a","transparent");
}
</script>
<title>Khaos</title>
</head>
<body>
<div id="global">
<div id="fondo">
<div id="cabecera">Bienvenidos a mi Web</div>
<ul class="postnav">
Inicio
Bandas
Videos
Galerias
Foro
<div id="menu">
<h1>Título de Sección 1</h1>
<ul>Enlace 1Enlace 2
Enlace 3Enlace 4
</div>
<div id="contenido">
<h1>Titulo</h1>
sffi dn vndknbksnbknkdbz; ;,a,,roouororoaoro rgk[p ek bkdf kb;sk';b;'b';sb
bfbsfd;blm;ldfmb;lsm;lmb;dmfbmsdfmvfvsmfvmsdofmvodmfvmsfmomgomdfmemgemgs;f,v ';
dfmb;lsm;l mslm lmsfmvlsm msm m msmfv;lms l;ms;l m;lm ;lsml;m ;ldml; ms;lm ;ms;lm
fmb l;m;lbm;lsdfmbl;m;lgbm l;mgl;bm l;sml;gb mlmblmsmb lgl ;bms;bm ;lmb m;bml ml
g bml;fmgbl;mlbmmf;lbmd;fbmlgbm;.</p>
sffi dn vndknbksnbknkdbz; ;,a,,roouororoaoro rgk[p ek bkdf kb;sk';b;'b';sb
bfbsfd;blm;ldfmb;lsm;lmb;dmfbmsdfmvfvsmfvmsdofmvodmfvmsfmomgomdfmemgemgs;f,v ';
dfmb;lsm;l mslm lmsfmvlsm msm m msmfv;lms l;ms;l m;lm ;lsml;m ;ldml; ms;lm ;ms;lm
fmb l;m;lbm;lsdfmbl;m;lgbm l;mgl;bm l;sml;gb mlmblmsmb lgl ;bms;bm ;lmb m;bml ml
g bml;fmgbl;mlbmmf;lbmd;fbmlgbm;.</p>
sffi dn vndknbksnbknkdbz; ;,a,,roouororoaoro rgk[p ek bkdf kb;sk';b;'b';sb
bfbsfd;blm;ldfmb;lsm;lmb;dmfbmsdfmvfvsmfvmsdofmvodmfvmsfmomgomdfmemgemgs;f,v ';
dfmb;lsm;l mslm lmsfmvlsm msm m msmfv;lms l;ms;l m;lm ;lsml;m ;ldml; ms;lm ;ms;lm
fmb l;m;lbm;lsdfmbl;m;lgbm l;mgl;bm l;sml;gb mlmblmsmb lgl ;bms;bm ;lmb m;bml ml
g bml;fmgbl;mlbmmf;lbmd;fbmlgbm;.</p>
</div>
<div id="pie">
<div id="uno">
<ul>
Foro EjemploContactosNos Enlazan
</div>
<div id="dos"></div>
<div id="tres">
<ul>
DirectorioTopSiteMapa de la Web
</div>
</div>
</div>
</div>
</body>
</html>
CSS:
* {margin:0px ; padding:0px ; border: 0px}
p {text-align: justify}
h1 {font-size: 1.2em; color:blue ; font-weight: bold ; text-decoration: underline ; text-align: center}
h2 {font-size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}
body {background-color: #cccccc;text-align: center}
#global {width:800px ; margin:4px auto ;}
#fondo {background-color:#333333;}
#cabecera {background-color:#666666 ; margin: 5px 5px 0px 5px }
ul.postnav,ul.postnav li{margin-left:2px;margin-top:3px ;padding:0;list-style-type:none}
ul.postnav li{float:left;width: 154px;height:19px;font-size:80%;margin-right: 3px}
ul.postnav a{display:block;width:154px;padding:5px 0;font: bold 100% Verdana,Arial,sans-serif;
text-transform:uppercase;background:#999999;color:#802A2A;
text-decoration:none;text-align:center}
ul.postnav a:hover{background:#99cccc;color: black;text-decoration:none}
#contenido {float:right;background-color:#99cccc ; margin: 5px 5px 5px 0px;width: 640px ;}
#contenido p {padding: 5px 10px 5px 10px ; text-indent: 15px }
#menu {float:left;background:#ffffff ; width: 145px ; margin: 5px 0px 5px 5px }
#menu h1 {text-decoration:none ; font-size:10px}
#menu li {text-align:left ;list-style:none ; margin: 4px 8px 4px 6px }
#pie {background-color:#666666 ; margin: 0px 5px 5px 5px ;;clear:both;
}
#pie li {list-style: none ; font-size: 12px }
#uno {background-color:#666666 ; float:left ; width:148px ; margin: 2px 0px 5px 2px ;font-size:12px}
#dos {background-color:#666666 ; float:left ; width:490px ; margin: 2px 0px 5px 0px;font-size:12px}
#tres {background-color:#666666 ; float:left ; width:148px ; margin: 2px 2px 5px 0px;font-size:12px}
a {color: #802A2A ; text-decoration:none ; display: block }
a:link {}
a:visited {}
a:hover {color:red ;text-decoration:underline ;}
a:active {}
Hola:
Bueno, lo que parece ser que usted hizo, fue poner el código para que los navegadores pudieran reconocer las tildes y los acentos, como los códigos son todos en inglés, la razón de tener que poner ese código ISO es porque en el inglés no existe la letra ñ ni los acentos, por eso tuvieron que inventar, por decirlo de alguna manera ese código.
En su página por lo poco que veo hasta ahora, (no lo tome usted como que debiera de hacerlo como yo le digo, porque no he visto su página de tal manera que pueda decirle , haga esto o haga lo otro) solo le diré lo que yo habría hecho para ahorrarme un poco de problemas, por ejemplo, si usted se fija , dentro de la capa #fondo usted tiene metidas todas sus capas, la cabecera, la capa menu, la capa contenido, la capa pie, en realidad es la capa #global la que contiene a todas las demás, incluyéndo a esa capa fondo, pero como usted ha metido todas las demás capas en la capa fondo, yo habría hecho que todo esos ul, por ejemplo:
ul.postnav,ul.postnav li{margin-left:2px;margin-top:3px ;padding:0;list-style-type:none}
ul.postnav li{float:left;width: 154px;height:19px;font-size:80%;margin-right: 3px} hubieran estado dentro de una capa a la que habría llamado #nav
Y en la página html, habría puesto
<div id="cabecera">Bienvenidos a mi Web</div>
<div id="nav">
<ul class="postnav">
Inicio
Bandas
Videos
Galerias
Foro
</div>
<div id="menu etc. etc.
Y en la hoja de estilo a esa capa nav le habría dado un altura de unos 35 px, por ejemplo
#cabecera{etc. etc. etc.}
#nav{background-color:#0000FF;height:35px} (el color es irrelevante, solo sirve para diferenciar por el momento esa capa de las demás,
Eso es lo que habría hecho yo, porque así tendría dominada esa lista de enlaces dentro de esa capa.
Ahora hablándo acerca de esa lista de ul
veo, (y también lo digo solo a título personal), que usted tiene definido lo siguiente
ul.postnav,ul.postnav li{margin-left:2px;margin-top:3px ;padding:0;list-style-type:none}
ul.postnav li{float:left;width: 154px;height:19px;font-size:80%;margin-right: 3px}
Si se da cuenta, usted tiene repetido ese ul.postnav li, primero acompañado por el ul.postnav y después mas abajo le da unas directivas otra vez pero a el solo .
Yo destrozando un poco los códigos habría añadido al li de abajo los códigos que están arriba (pero solo los que debieran de pertenecer al li) por ejemplo el margin-left, el margin-top, el list style type none. Y después habría eliminado ese ul.postnav li de arriba, el que acompaña al ul.postnav, y a ese ul.postnav lo habría dejado solo con sus códigos.
Lo otro que yo habría probado, digo probado porque esto no es una ciencia exacta, (aunque lo parezca). habría sido haberle añadido a la capa #fondo
un float:left; para ver como se comporta, ya que como la capa #global es la que está centrada, yo , como le digo le habría puesto un float:left a esa capa #fondo, así seguramente habría tenido menos problemas con las capas flotantes como la menu y la contenido.
Fuera de que una de las cosas que mas molesta es que no todos los navegadores, por muy modernos que estos sean, soportan algunas directivas, demasiado modernas para ellos.
Lo que yo le he dicho, le recuerdo, solo son ideas mías, le recuerdo que no he visto sus códigos tan minuciosamente aun
Saludos