Hola he creado una pagina (o mas bien la base) con el curso paso a paso y he utilizado el Html-kit, pero al comprobar en algun explorador la web muta. Creo que el principal problema son los divs. Tambien he advertido que el dreamweaver lo muestra como los navegadores y el html kit lo muestra como si no pasase nada.
Habia cambiado el doctype a xhtml 1.0 transicional (aunque no influya yo lo digo por si las moscas).
este es el codigo:
<!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>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all" />
<title>xxxxxxxx xxxxxxxxxxx xxxxxxxxxx xxxxxxxxxxx</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="Keywords" content="xxxxxxxxxxx xxxxxxxxxxx xxxxxxxxxx " />
<meta name="Description" content="xxxxxxx xxxxxxx xxxxxxxxx xxxxxxxxxxx " />
<meta name="Author" content="xxxxxxxxxxxxxxxxx" />
<meta name="Subject" content="xxxxxxxxxxxxx" />
<meta name="Language" content="es" />
<meta name="Robots" content="index, follow" />
</head>
<body>
<div id="global">
<div id="apertura">
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="#">ABOUT US</a></li>
<li><a href="#">HOME</a></li>
<li><a href="#">CONTACT</a></li>
<li><a href="#">SITE MAP</a></li>
<li><a href="#">XXXXXXXXX</a></li>
</ul>
</div>
<div id="cabecera">
<div id="logotipo">
<a href="index.html"><img src="objetos/sombrarosa.jpg" width="80" height="80" alt="inicio" a href="index.html"/>
</a>
</div>
<p class="tipo">XXXXXXXXXXXX</p></div>
<div id="navegacion">
<ul>
<li>
<a href="index.html"></a><a href="maquillaje/maquillaje.html">XXXXXXXXXXXX</a></li>
<li><a href="herramientas/herramientas.html">XXXXXXXX</a></li>
<li><a href="accesorios/accesorios.html">XXXXXXXX</a></li>
<li><a href="sets/sets.html">XXXXX</a></li>
<li><a href="custom/custom.html">XXXXX</a></li>
<li><a href="paletas/paletas.html">XXXXXXXX</a></li>
</ul>
</div>
<div id="otra">
<div id="principal"><img src="objetos/labios.jpg" width= "213" height= "141" ; alt="xxxxxxx xxxxxxx" />
</div>
</div>
<div id="contenido">
<div id="menu">
<ul>
<li><a href="#">XXXXXX1</a></li>
<li><a href="#">XXXXXX2</a></li>
<li><a href="#">XXXXXX3</a></li>
<li><a href="#">XXXXXXXXXXX4</a></li>
<li><a href="#">XXXXXXXXX5</a></li>
</ul>
</div>
<h1>xxxxxxxxxx xxxxxxxx xxxxxxxxx xxxxxxxxxxx xxxxx</h1>
<p>XXXXXXXXXXXXXXXXXXXX XXXXXXXXXXXX XXXXXXXXXXXXX XXXXXXXXXXXXX XXXXXXXXXXXXXX XXXXXXXXXXXXX XXXXXXXXXXXXXX
XXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXX XXXXXXXXXXX XXXXXXXXXXXXXXXXX XXXXXXXXXXXXXX XXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXX XXXXXXXXXXXXX XXXXXXXXXXXX XXXXXXXXXXXXX XXXXXXXXXXXXX XXXXXXXXXXX XXXXXXXXXXX
XXXXXXXXXX XXXXXXXXXX XXXXXXXXXXXX XXXXXXXXXXXXXXXX XXXXXXXXXXXXX XXXXXXXXXXXX XXXXXXXXXXXXXX XXXXXXXXXX XXXXXXXX
XXXXXXX XXXXXXXXXXX XXXXXXXXXX XXXXXXXXXX XXXXXXXXXX XXXXXXXXXXXX XXXXXXXXXX XXXXXXXXX XXXXXXXXXXX XXXXXXXXXXXX
XXXXXXXXXXXXXXX XXXXXXXXXXXXXX XXXXXXXXXX XXXXXXXXX XXXXXXXXXXXXX XXXXXXXXXXXX XXXXXXXXXXXXXXXX XXXXXXXXXXXXX
XXXXXXXXXXXXXXXX XXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXX XXXXXXXXX XXXXXXXXX
XXXXXXXXX XXXXXXXXXX XXXXXXXXXXXXXX XXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXX XXXXXXXXXXXXXXX XXXXXXXXXXXX XXXXXXXXXX, XXXXXXXXXXXXXX XXXXXXXXXXXXXXXX XXXXXXXXXXXXXX XXXXXXXXXX.</p>
</div>
<div id="antepie">
<h2>XXXXXXXXXX XXXXXXX XXXXXXXXXXXXXXXX</h2>
<p>XXXXXXXXX XXXXXXXXX XXXXXXXXX XXXXXXX XXXXXXXXXXXXXX XXXXXXXXXXXXXXX XXXXXXXXXXXXXX XXXXXXXX
XXXXXXXXXXXXX XXXXXXXXXXXXXXXX XXXXXXXXXXXXXXX XXXXXXXXXXXXX XXXXXXXXXXXXXXX XXXXXXXXXXXX.</p>
<p>XXXXXXXXXXXX XXXXXXXXXXX XXXXXXXXXXXXXXXX XXXXXXXXXXXXXXXX XXXXXXXXXXXXXXX XXXXXXXXXXX,
XXXXXXXXXXXXX XXXXXXX XXXXXXXX XXXXXXX XXXXXXXX XXXXXXXX XXXXXXX XXXXXXXXXXXXX XXXXXXXXXXX.</p>
</div>
<div id="pie">
<ul>
<li><a href="#">HOME</a></li>
<li><a href="#">ABOUT US</a></li>
<li><a href="#">HOME</a></li>
<li><a href="#">CONTACT</a></li>
<li><a href="#">SITE MAP</a></li>
<li><a href="#">CUSTOMER SERVICE</a></li>
</ul>
</div>
<div id="fin"><p>xxxxxxxxxxx xxxxxxxxxxxxx xxxxxxxxxxxxx.</p>
</div>
</div>
</body>
</html>
-------------------------------------
el CSS:
body {text-indent:0px ; text-align: center ; background-image: url(objetos/xxxxxxxxx.jpg) ; background-repeat: no-repeat ; background-position: center center ; height: 1000px ; width: 1000px ; background-color:#000000;}
* {margin:0px ; padding:0px ; border: 0px ;}
.tipo {font-family: IrisUPC ; color: #000000; text-decoration: none; word-spacing: normal; text-align: center; letter-spacing: 9px; line-height: 2em; font-size: 3em;}
h1 {font-family: helvetica ; font-size: 1.2em; color:#f1396d ; font-weight: bold ; text-decoration: none ; text-align: center ;}
h2 {font-family: helvetica ; font.size: 1.1em; color:#f0157d ; font-weight: bold ; text-decoration: none ; text-align: center ;}
p {font-family: helvetica, arial ; font-size: 1em ; padding: 5px 10px 5px 10px ; text-indent: 0px ; text-align: justify ; color: #696969;}
#global {background-color: #382f32 ; margin: 0px auto ; width: 800px}
#apertura {background-color:#000000 ; width:800px; clear:right}
#apertura li {float: left ; list-style: none; margin-right: 10px;}
#cabecera {background-color:#ffffff ; width:800px}
#logotipo {float: left ;}
#navegacion {background-color: #f1396d ; width: 800px ; border-top: black 1px solid ; border-bottom: black 1px solid;}
#navegacion li {float: left ; list-style: none; margin-right: 10px; margin-left: 10px ; text-align: central;}
#otra {background-color: #ffffff; border-bottom: #808080 1px solid ; width: 800px}
#principal {width: 200px ; height:170px ; float:right ; text-align:left ; padding-top: 20px ; padding-left: 20px }
#contenido {background-color: #ffffff ; width:800px ; float:left ;}
#contenido p {font-family: Helvetica ; text-decoration: none ; word-spacing: 0.1em;
text-align: justify ; letter-spacing: 0px ; line-height: 1em ; font-size: 1em ; padding: 5px 10px 5px 10px ; text-indent: 0px ;}
#contenido li {font-family: Helvetica}
#menu {background-color: #ffffff; height: 400px ; width: 150px ; float:left ; text-align:left ; padding-top: 20px ; padding-left: 20px ; }
#menu li { list-style:none ; font-weight: bold; }
#antepie {background: trasparent ; border-top: 1spx solid ; width: 800px ; height: 600px}
#pie {background-color: #000000; width: 800px; clear:right}
#pie li {float: left ; list-style: none; margin-right: 10px; margin-top: 20px;}
#fin {background-color: #000000 ;height: 100px;}
#fin p {color: #ffffff}
a {color:#808080 ; text-decoration : none ;}
a:link {font-family: helvetica, arial, sans-serif ; font-size: 1em;}
a:visted {}
a:hover {color : #f1396d ; text-decoration : none ;}
a:active {}
#navegacion li a {font-family: helvetica ; color:#000000 ; text-decoration : none ; font-weight: bold ; font-size: 1em;}
#navegacion li a:link { }
#navegacion li a:visted {}
#nevegacion li a:hover {color : #f1396d ; text-decoration : none ;background-color:#F08080}
#navegacion li a:active {}
#apertura li a {font-family: helvetica ; font size: 0.75em}
#apertura li a:link {}
#apertura li a:visited { }
#apertura li a:hover {}
#apertura li a:active {}
#logotipo a {}
#logotipo a:link {}
#logotipo a:visited {}
#logotipo a:hover {background-color: white }
#logotipo a:active {}
#pie li a {color: #696969 ; font-size: 0.5em}
#pie li a:link {}
#pie li a:visited {}
#pie li a:hover {color: #808080}
#pie li a:active {}
---------------------------------------------------------
Lo que me pasa basicamente es que las capas que iban una debajo de otra y que tienen un ancho fijo en pixeles ahora me aparecen una al lado de la otra en un tamaño bastante menor ocupando el espacio que permite la capa GLOBAL, me pasa con las dos de arriba y las dos de abajo (apertura y cabecera; pie y fin). Ademas el texto de una de las capas de abajo me aparece en una de las de arriba (de "antepie" a "otra"). Tambien la capa navegacion se ha transformado: ha perdido el color, y algun borde. En fin...Lo unico que no ha perdido el formato es la capa contenido y su capa anidada menu lateral.
He ido haciendo comprobaciones en los exploradores regularmente durante el proceso y no me habia pasado nada parecido.
estoy desesperada :(
DE TODAS MANERAS HE APRENDDO MUCHISIMO (DESDE 0)
GRACIAS A JORGENS ;)