Pagina arruinada

Webmast · 28 Jun 2013, 01:17 · Solicitar retirada

:mad:
Estaba programando mi página web pero todo iba bien en el preview de html-kit hasta que lo subi y todo se hizo un revoltijo.
la imagen de fondo no aparece, el pie no respeta las reglas de list-style:none y aparece con saltos de página en lugar de aparecer en sus secciones correspondientes por favor necesito ayuda

http://universoacuatico.uphero.com

francisco1 · 28 Jun 2013, 18:24 · Solicitar retirada

Hola y si le pones un width al pie para que los enlaces del pie vallan a su
sitio y mejor utiliza los principales navegadores para ver tus avances.

  
#pie  { 
background-color: white ; 
border-left: black 1px solid ;  
border-right: black 1px solid;  
border-top: black 1px solid; 
height: 65px ;  
}

Webmast · 29 Jun 2013, 01:59 · Solicitar retirada

Gracias, pero no se solucionó mira en la misma página y aquí están mis códigos

Hoja de estilos

* {text-indent:0px ; margin:0px ; padding:0px ; border:0px}
p {text-align: justify;color:white;font-family:Myriad Pro Light,Adobe Fan Heiti Std B,Kozuka Gothic Pro B,Calibri,Arial}
h1 {font-family: Candara, Corbel, DejaVu Sans Condensed;font-size: 1.2em; color:red ; font-weight: bold ; text-decoration: none ;
text-align: center}
h2 {font.size: 1.1em; color:red ; font-weight: bold ; text-decoration: none ;
text-align: center}
body {text-align: center;}
#global {width:800px ; margin:4px auto }

#curva-superior {background-image: url(objetos/curva-superior.gif) ;
background-repeat: no-repeat ;
width:800px ;
height:12px ;
overflow: hidden }
#cabecera {background-color: white ; border-left: black 1px solid ;
border-right: black 1px solid ; height:85px}
#logotipo {width:280px ; float:left }
#publicidad {width:518px ; float:right ; margin-top:25px ; font-size: 16px;font-family:Candara, Corbel, DejaVu Sans Condensed }
#navegacion {background-color: MediumTurquoise ; border: black 1px solid ; height:20px}
#navegacion li {float:left ; list-style:none ;font-family:Myriad Pro Light,Adobe Fan Heiti Std B,Kozuka Gothic Pro B,Calibri,Arial; margin: 0px 7px 0px 7px }
#navegacion ul { margin-left: 40px }
#contenido {background-color: white ; border-left: black 1px solid; border-right :black 1px solid ;{background-image: url(objetos/collage.jpg);}
#contenido p {margin: 5px 10px 0px 10px ; text-indent: 15px}
#menu {width: 150px ; float:left ; text-align:left ; margin: 5px 10px 5px 3px ;background-image: url(objetos/menu-parte-inferior.gif);
background-position: bottom ;
padding-bottom:5px }
#menu li {list-style:none ; margin: 4px 8px 4px 6px }
#menu h1 {text-decoration:none ; font-size:12px ; padding-top:12px ;
background-image: url(objetos/menu-parte-superior.gif) }
#pie {
background-color: white ;
border-left: black 1px solid ;
border-right: black 1px solid;
border-top: black 1px solid;
height: 65px ;
}
#pie li {list-style:none; font-size:12px; font-family:Candara, Corbel, DejaVu Sans Condensed;}
#pieuno { float:left; width:150px;}
#piedos {float:left; width:498px;font-family:Candara, Corbel, DejaVu Sans Condensed}
#pietres {float:right; width:150px;}
#curva-inferior {background-image: url(objetos/curva-inferior.gif) ;background-repeat: no-repeat ;width: 800px ;height:2px ;overflow: hidden}
a {color: IndianRed ; text-decoration:none ; display: block }
a:link {}
a:visited {}
a:hover {color:red ; text-decoration:underline ; background-color: silver}
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}
#logotipo a {}
#logotipo a:link {}
#logotipo a:visited {}
#logotipo a:hover {background-color: white }
#logotipo a:active {}

Index

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html lang="es">
<head>
<title>Universo Acuatico.tk</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<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"> <a href="index.html">
<img src="objetos/banner03.gif" width="280" height="70"
alt="Haz clic aquí para volver a la página de inicio">
</a>
</div>
<div id="publicidad">Bienvenidos a "Universo acuatico.tk"</div>

</div>
<div id="navegacion"><ul><li><a href="index.html">Inicio</a></li><li><a href="informacion/informacion.html">Información</a></li><li><a href="galeria/galeria.html">Galería</a></li><li><a href="mosaico/mosaico.html">Mosaico</a></li><li><a href="records/records.html">Récords</a></li><li><a href="noticias/noticias.html">Noticias</a></li><li><a href="foro/foro.html">Foro</a></li><li><a href="concursos/concursos.html">Concursos</a></li></ul></div>

<div id="contenido">
<div id="fondo">
</div>


<h1>Bienvenidos a la página oficial de "Universo Acuatico".</h1>
<p>Aquí podrás encontrar toda la información necesaria para que tu mascota acuatica esté feliz y sana.</p>
<p>Si eres nuevo en este mundo de acuarismo,
te invitamos a conocer todos los requerimentos de la mascota que planeas tener.
Podrás ver la imformación de una gran variedad de especies aquí, con galeria de fotos.
Si ya tienes una mascota podrás ver lo que necesita o, si está enferma,
consultar las atenciones especiales que le debes de hacer.</p>

</div>

<div id="pie">

<div id="pieuno">
<ul><li><a href="#">Foro</a></li><li><a href="#">Información</a></li><li><a href="#">Términos y condiciones</a></li></ul>
</div>

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

<div id="pietres">
<ul><li><a href="#">Mapa del sitio</a></li><li><a href="#">Enlaces</a></li><li><a href="#">Galeria</a></li></ul>

</div></div>



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

Webmast · 29 Jun 2013, 02:00 · Solicitar retirada

A por cierto desde ahora lo estoy viendo en google chrome

francisco1 · 29 Jun 2013, 09:30 · Solicitar retirada

Hola tenia muchos fallos compara tus estilos anteriores con estos estilos que ya están corregidos y veras la cantidad de fallos que tenían.

Solo puse este codigo en pie width: auto;

 
* { 
text-indent: 0; 
margin: 0; 
padding: 0; 
border: 0; 
} 
p { 
text-align: justify; 
color: white; 
font-family: Myriad Pro Light,Adobe Fan Heiti Std B,Kozuka Gothic Pro B,Calibri,Arial; 
} 
h1 { 
font-family: Candara, Corbel, DejaVu Sans Condensed; font-size: 1.2em; 
color: red; 
font-weight: bold ; 
text-decoration: none; 
text-align: center; 
} 
h2 { 
font-size: 1.1em; 
color: red; 
font-weight: bold; 
text-decoration: none; 
text-align: center; 
} 
body { 
text-align: center; 
} 
#global { 
width: 800px; 
margin: 4px auto; 
}
#curva-superior { 
background-image: url(objetos/curva-superior.gif); background-repeat: no-repeat; 
width: 800px; 
height: 12px; 
overflow: hidden; 
} 
#cabecera { 
background-color: white; 
border-left: black 1px solid; 
border-right: black 1px solid; 
height: 85px; 
} 
#logotipo { 
width: 280px; 
float:left; 
} 
#publicidad { 
width: 518px; 
float: right; 
margin-top: 25px; 
font-size: 16px; 
font-family: Candara, Corbel, DejaVu Sans Condensed; 
} 
#navegacion { 
background-color: MediumTurquoise; border: black 1px solid; 
height: 20px; 
} 
#navegacion li { 
float: left; 
list-style: none; 
font-family: Myriad Pro Light,Adobe Fan Heiti Std B,Kozuka Gothic Pro B,Calibri,Arial; 
margin: 0px 7px 0px 7px; 
} 
#navegacion ul { 
margin-left: 40px; 
} 
#contenido { 
background-color: white; 
border-left: black 1px solid; 
border-right: black 1px solid; 
background-image: url(objetos/collage.jpg); 
} 
#contenido p { 
margin: 5px 10px 0px 10px; 
text-indent: 15px; 
} 
#menu { 
width: 150px; 
float: left; 
text-align: left; 
margin: 5px 10px 5px 3px; 
background-image: url(objetos/menu-parte-inferior.gif); 
background-position: bottom; 
padding-bottom: 5px; 
} 
#menu li { 
list-style: none; 
margin: 4px 8px 4px 6px; 
} 
#menu h1 { 
text-decoration: none; 
font-size: 12px; 
padding-top:12px; 
background-image: url(objetos/menu-parte-superior.gif); } 
#pie { 
background-color: white; 
border-left: black 1px solid; 
border-right: black 1px solid; 
border-top: black 1px solid; 
height: 65px ; 
width: auto; 
} 
#pie li { 
list-style: none; 
font-size: 12px; 
font-family: Candara, Corbel, DejaVu Sans Condensed; } #pieuno { 
float: left; 
width: 150px; 
} 
#piedos { 
float: left; 
width: 498px; 
font-family: Candara, Corbel, DejaVu Sans Condensed; } #pietres { 
float: right; 
width: 150px; 
} 
#curva-inferior { 
background-image: url(objetos/curva-inferior.gif); background-repeat: no-repeat; 
width: 800px; 
height:2px; 
overflow: hidden; 
}  
a  { 
color: IndianRed; 
text-decoration:none; 
display: block; 
} 
a:link {}
a:visited {}
a:hover { 
color:red; 
text-decoration:underline; 
background-color: silver; 
} 
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; 
} 
#logotipo a {} 
#logotipo a:link {} 
#logotipo a:visited {} 
#logotipo a:hover { 
background-color: white; 
}
#logotipo a:active {}

El html solo lo e mirado por encima, fíjate bien y repasalo a ver si tiene algún fallo también.

Ademas deverias visualizar tus avances en clome, firefox, opera, safari y internet explorer.

Un consejo si quieres tener éxito con esa web comprate un dominio .com por ejemplo los .tk cuesta mucho posicionarlos.

No deverias correr tanto y deverias fijarte mas en los detalles para no cometer tantos fallos eso te ahorrara futuros quebraderos de cabeza un saludo.

Webmast · 1 Jul 2013, 22:30 · Solicitar retirada

Muchisimas gracias, me has ayudado bastante, supongo que con las prisas me he equivocado
Mis agradecimientos[:)]

Webmast · 1 Jul 2013, 22:46 · Solicitar retirada

Gracias, me acabo de dar cuenta que la curva inferior no aparece revise el código y no noto porqué

francisco1 · 1 Jul 2013, 23:41 · Solicitar retirada

Si te fijas si se ve un poquito abajo lateral derecho, puede ser porque solo le diste height: 2px; prueva dándole un poco mas de alto height aver si se ve bien.

Webmast · 2 Jul 2013, 20:07 · Solicitar retirada

Se lo cambié a 12 px y ya se arregló todo.
Seguiré con el resto de las páginas, muchas gracias.
Gracias francisco