PROBLEMA CON PAGINA WEB

parate01 · 30 Oct 2009, 21:30 · Solicitar retirada

Amigos buenas tardes.

me gustaria saber si me pueden ayudar con este problemilla:

Esta semana diseñe una pagina web y al visualizarla en el IE se ve perfecta, pero al tratarla de abrir en mozilla, se desbarata toda, me gustaria escuchar sus opiniones y consejos para arreglarla.

el enlace es http//lovemoonsaludydinero.atwebpages.com

los codigos de la plantilla son:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>LOVEMOON.SALUD Y DINERO</title>
<link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
</head>
<body>
<div id="global">

<div id="curva-superior"></div>
<div id="cabecera">
<div id="logotipo">[contenido no disponible]</div>
<div id="titulo"><h1>LOVEMOON.SALUD Y DINERO</h1>
</div><div id="publicidad">[contenido no disponible]
</div>
<div id="navegacion"><ul>

Portada

La Empresa

Los Aniones

<a href="productos/productos.html">Productos

<a href="plan de compensacion/plan de retribucion.html">Plan de Retribucion

<a href="contacto/correo.html">Contactenos</div>
</div>

<div id="contenido">

[contenido no disponible]</p>
<h2>“Alta tecnología, para el cuidado seguro de la salud”</h2>
<h2>“La tecnología crea amor”</h2>
<h2>Tecnología de la Salud y Tecnología de la Información</h2>
<h2>El producto del amor es la salud, la cultura corporativa es amor</h2>
</div>

<div id="pie">
<div id="pieuno"><ul><a href="#"</a></div>
<div id="piedos"

[contenido no disponible]</div>
<div id="pietres"><ul>

</div>
<div id="curva-inferior"></div>
</div>
</div>

</body>
</html>

y los de la hoja de estilos son:

*{text-indent:0px ; margin:0px ; padding:0px ; border: 0px}
body{text-align: center}
#global{width:800px ; margin: 4px auto}
p {text-align: justify}
p1 {text-align: center}
.izquierda{text-align: left}
.derecha{text-align: right}
p3 {text-align: right}
h1 {font-size: 1.1em; color:#FF69B4 ; font-weight: bold ; text-decoration: none ; text-align: center}
h2 {font.size: 1.3em; color:#696969 ; font-weight: bold ; text-decoration: none ; text-align: center}
h3 {font-size: 1.3em; color:black ; font-weight: bold ; text-decoration: none ; text-align: center}
h4 {font.size: 1.3em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: center}
h5 {font-size: 1.2em; color:#FF69B4 ; font-weight: bold ; text-decoration: none ; text-align: center ; margin-top: 25px; margin-bottom: 25px ; padding-top: 15px ; padding-bottom: 15px}
#curva-superior {background-image: url(objetos/curva-superior.gif) ; background-repeat: no-repeat ; width:800px ; height: 10px ; overflow : hidden}
#cabecera {background-color:F0FFF0 ; border-left: black 1px solid ; border-right: black 1px solid ; height:200px}
#logotipo {width:220px ; float:left ; margin-top:20px ; margin-left:15px}
#titulo {width:400px ; float:center ; margin:CENTER ; font-size: 1.5em ; color: #FFB5C5}
#publicidad {width:150px ; float:center ; margin-top:5px ; margin-bottom:10px}
#navegacion {background-color: #66CDAA ; border: black 1px solid ; height:40px}
#navegacion li {float:left ; list-style:none ; margin: 5px 5px 5px 20px}
#navegacion ul { margin-left: 60px}
#contenido {background-color: #E0EEE0 ; border-left: black 1px solid ; border-right: black 1px solid }
#publicidad1 {width:170px ; float:center ; padding-bottom:15px}
#publicidad2 {width:170px ; float:center ; padding-top:15px ; padding-bottom:15px}
#publicidad3 {width:150px ; float:center ; padding-left:10px ; padding-right:10px ; padding-top:10px ; padding-bottom:10px}
#contenido p {padding: 5px 10px 5px 10px , text-indent: 20px}
#menu {width: 150px ; float:left ; text-align:left ; margin:3px 10px 3px 3px ; background-image: url(objetos/menu-parte-inferior.gif); background-position: bottom ; padding-bottom:8px}
#menu li { list-style:none ;margin:4px 6px 4px 6px}
#menu h1 {text-decoration:none ; font-size:13px ; background-image:url(objetos/menu-parte-superior.gif)}
#pie {background-color:F0FFF0 ; border-left: black 1px solid ; border-right: black 1px solid; border-top: black 1px solid ; height: 60px}
#pie li {list-style: none ; font-size: 12px}
#pieuno {float:left ; width:120px; margin-top: 20px}
#piedos {float:left ; width:450px; margin-left: 40px ; margin-right: 20px; margin-top: 10px ; margin-bottom: 10px}
#pietres {float:left ; width:120px; margin-top: 20px}
#curva-inferior {background-image: url(objetos/curva-inferior.gif) ; background-repeat: no-repeat ; width:798px ; height: 8px ; overflow: hidden}
a:{color: #4F4F4F ; font-size:1.2em ; text-decoration: none ; display: block}
a:link{}
a:visited{}
a:hover{color:blue ; text-decoration:underline ;background-color: #F5F5F5}
a:active{}
#pie a {color: blue ; text-decoration:none ; display: block}
#pie a:link {}
#pie a:visited {}
#pie a:hover {color:black ; text-decoration:underline ; background-color: white}
#pie a:active {color:black}

Muchas gracias.

Foley · 30 Oct 2009, 22:35 · Solicitar retirada

Tu enlace no funciona pero así a bote pronto vi este error en tu código css:

font.size

Tienes que poner:

font-size

Pon bien la dirección de la web y te ayudo mejor, necesito verla.

Saludos ;)

Kamael · 30 Oct 2009, 22:54 · Solicitar retirada

vamos paso por paso ok????

fijate q no serraste bien algunas ordenes
<div id="piedos">

[contenido no disponible]</div>
la parte roja es la q falta :P bueno sigo buscando errores :P

Yaneth · 30 Oct 2009, 23:00 · Solicitar retirada

hola
hay varios errores

<div id="logotipo">[contenido no disponible]</div>
no cerraste <img xxxxxxxx >

igual aqui

[contenido no disponible]

[contenido no disponible]</a>

huyyy, hay un monton de errores
la cabecera està toda descuadrada
pero dime cual es la estructura que debe tener?
imagen derecha, titulo, imagen izquierda?????

<div id="cabecera">
<div id="logotipo">[contenido no disponible]</a></div>
<div id="titulo"><h1>LOVEMOON.SALUD Y DINERO</h1>
</div><div id="publicidad">[contenido no disponible]</div>
</div>

#cabecera {background-color:F0FFF0 ; border-left: black 1px solid ; border-right: black 1px solid ; height:200px}
#logotipo {width:220px ; float:left ; margin-left:15px}
#titulo {width:400px ; float:left ; font-size: 1.5em ; color: #FFB5C5; height:50px}
#publicidad {width:150px ; float: left ; margin-top:5px ; margin-bottom:10px}

checalo, subes los cambios y nos avisas para seguir checando

saludos

Kamael · 30 Oct 2009, 23:03 · Solicitar retirada

fijate esta parte

<div id="navegacion"><ul>

Portada

La Empresa

Los Aniones

<a href="productos/productos.html">Productos

<a href="plan de compensacion/plan de retribucion.html">Plan de Retribucion

<a href="contacto/correo.html">Contactenos</div>

muy complicado lo hiciste :P simplifica :P
<div id="navegacion"><ul>

PortadaLa EmpresaLos AnionesProductos<a href="plan de compensacion/plan de retribucion.html">Plan de Retribucion<a href="contacto/correo.html">Contactenos</div>

las partes rojas aumente y las partes azules le quite

Yaneth · 30 Oct 2009, 23:06 · Solicitar retirada

??????
no me queda claro esa explicacion???
se supone que asi se hacen las listas no???

texto

bueno, al menos eso es lo que nos enseñaron en el curso
dime...
esa forma de hacerlas no las conosco, funciona???? tu las haces asi????
deberè investigar al respecto

gracias por la informacion

Kamael · 30 Oct 2009, 23:07 · Solicitar retirada

yo????????????''' xD

Yaneth · 30 Oct 2009, 23:26 · Solicitar retirada

es que, en el curso paso a paso
jorgens nos enseña a hacer el menu asi, con las li

Kamael · 30 Oct 2009, 23:33 · Solicitar retirada

Bueno si enseña hacer asi pero yo uso eso para mi blog y no me da problemas pero tienes razon a el si le dara por q tendria q poner margenes a <a> para q no se vea junto :P

Bueno encontre "n" errores en tu html se ve q no te gusta cerrar las ordenes q das voy a corregir todo y te paso el html con todo cerrado :P y algunas cosas q faltan :P lo de estilos lo vemos despues

Kamael · 30 Oct 2009, 23:49 · Solicitar retirada

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>LOVEMOON.SALUD Y DINERO</title>
<link rel="stylesheet" href="estilos.css" type="text/css" media="all">
</head>
<body>
<div id="global">

<div id="curva-superior"></div>
<div id="cabecera">
<div id="titulo"><h1>LOVEMOON.SALUD Y DINERO</h1>
</div>
<div id="logotipo">
[contenido no disponible]</img></a>
</div>
<div id="publicidad">
[contenido no disponible]</img>
</div>
</div>

<div id="navegacion">
<ul>

Portada

La Empresa

Los Aniones

Productos

Plan de Retribucion

Contactenos

</div>

<!--
<div id="menu">
<ul>
<h1>Titulo de Seccion 1</h1>

Enlace 1

Enlace 2

Enlace 3

Enlace 4

</div>-->

<div id="contenido">

[contenido no disponible]</p>
<h2>“Alta tecnología, para el cuidado seguro de la salud”</h2>
<h2>“La tecnología crea amor”</h2>
<h2>Tecnología de la Salud y Tecnología de la Información</h2>
<h2>El producto del amor es la salud, la cultura corporativa es amor</h2>
</div>

<div id="pie">
<div id="pieuno">
<ul>
<a href="#"</a>

</div>
<div id="piedos">

<a href="">[contenido no disponible]
</div>
<div id="pietres">
<ul>

</div>
<div id="curva-inferior"></div>
</div>
</div>

</body>
</html>

Esa hoja de html esta correcta con todo cerrado le di un poco de orden bueno comparala con la tuya

rodojpm · 30 Oct 2009, 23:59 · Solicitar retirada

Yaneth;
creo que Kamael habla de algo como no hacer listas y simplemente poner un enlace al lado de otro, pero a pesar de que cada persona tiene sus criterios y su libre razonamiento, creo que es mucho mas simple hacerlo por medio de las listas por cuestiones de modificaciones que se vayan a hacer ade mas de ese modo quedaria asi:
Enlace 1 Enlace 2 Enlace 3 Enlace 4 Enlace 5

Todo es cuestion de gustos

Yaneth · 31 Oct 2009, 00:02 · Solicitar retirada

si lo comprendo
son distintas formas de trabajar
yo tambien a veces hago el menu asi sin tanta li

pero, como el chico que pregunta, hizo el curso, entonces debemos ayudarle en base a el y encontrar los errores que el cometio

de lo contrario lo confundiremos mas no crees????

parate01 · 2 Nov 2009, 16:16 · Solicitar retirada

Yanethmuchas gracias.

efectivamente tenia un poco de cosas si cerrar.
Ya arregle todo lo que me dijiste asi como lo dijiste y al cargarla en otros navegadores se sigue descuadrando.

vuelvo a publicar el enlace para que vean la pagina.
lovemoonsaludydinero.atwebpages.com

de antemano agradezco sus comentarios.

cordialmente

Kamael · 2 Nov 2009, 17:00 · Solicitar retirada

Bueno te faltan los "float" en tu hoja de estilos y tambien tienes q poner el tamaño de tu contenido es decir un "width" el pie de pagina = tiene q tener un "width" y un "float"

Yaneth · 2 Nov 2009, 22:01 · Solicitar retirada

hola

pero lo cerraste mal compañero

para poner una imagen es asi

[contenido no disponible]

y no asi

[contenido no disponible]

parate01 · 6 Nov 2009, 14:58 · Solicitar retirada

Muchas gracias a los colaboradores que me dieron sus consejos para arreglar mi pagina web.

ya modifique todo y quedo asi:

lovemoonsaludydinero.atwebpages.com

de nuevo muchas gracias..

Yaneth · 6 Nov 2009, 17:01 · Solicitar retirada

me alegra que hayas podido hacer los cambios

tu pàgina quedò como la deseas????

cualquier cosa, psor aqui andamos

saludos

parate01 · 6 Nov 2009, 17:10 · Solicitar retirada

Yaneth escribió:me alegra que hayas podido hacer los cambios

tu pàgina quedò como la deseas????

cualquier cosa, psor aqui andamos

saludos

si yaneth quedo como la queria.

me gustaria que la vieras y me contaras que opinas

gracias

el enlace es lovemoonsaludydinero.atwebpages.com