Problema con la separación de imagenes en la web

paxarin · 16 Mar 2010, 22:00 · Solicitar retirada

Muy buenas he realizado unos cambios en la web.
He creado una serie de imagenes, que por un motivo que no consigo saber estan separadas.
Os dejo el html.
:arrow:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Lista de espera sanitaria</title>
<link rel="stylesheet" href="estilos.css" type="text/css" media="all">
</head>
<body>
<div id="logotipo">
[contenido no disponible]
</div>
<div id="cuerpo">
<div id="navegacion">
<ul>

[contenido no disponible]

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

Esta Web esta enfocada principalmente para la gente que se encuentre atrapada en alguna lista de espera sanitaria, bien sea para consultas, pruebas hospitalarias o intervenciones quirúrgicas</p>

Aquí encontrareis todo tipo de información sobre este tema, como la constitución española, ley de garantia de la sanidad publica, noticias publicadas en la prensa y un foro de discusión. En el que podreis valorar los temas de la web, asi como expresar vuestros casos y pensamientos sobre este tema. </p>

Amparándonos en la Constitución Española y haciendo uso del articulo 20, esta Web ve la luz con la esperanza de que sirva de ayuda a cualquier persona afectada por este moderno "mal" que recorre ya las principales arterias de nuestro sistema sanitario sin control ninguno.</p>

Espero que con vuestra ayuda y colaboración hagamos posible que este proyecto continué hacia delante.</p>
</div>
<div id="menu">
<ul>

[correo eliminado]

[contenido no disponible]

[contenido no disponible]

</div>
<div id="pie">
[contenido no disponible]
</body>
</html>

y la hoja de estilos.
:arrow:
body{background-image:url(objetos/azul.jpg);background-repeat:repeat-x}
img {border-style: none}
#global{width:800px}
#cuerpo {width:800px; float:left; margin: 0px 0px 0px 175px; background:white}
#logotipo{margin:0px 0px 0px 175px}
#navegacion {}
#navegacion li {float:left ; list-style:none}
#navegacion ul {margin-left:0px}
#separador{width:800px}
#contenido{width:500px;float:left;margin:20px }
#menu{width:200px;float:right}
#menu li{float:right; list-style:none}
#menu ul{}
#pie {}

Espero que me podais esplicar el por que.
Un saludo y muchas gracias de antemano.

paxarin · 17 Mar 2010, 13:16 · Solicitar retirada

Resumiendo.
Mi problema es que por ejemplo entre la parte superior de la web y la barra de navegación existe una separación que no consigo eliminar.
Tambien existe en otras imagenes de la web, pero una vez solucione una solucionare todas.
Un saludo

seba_academico · 17 Mar 2010, 16:50 · Solicitar retirada

dejanos la url de tu web para que veamos nosotros tambien el problema y haci poder revisar el codigo

paxarin · 17 Mar 2010, 17:03 · Solicitar retirada

seba_academico escribió:dejanos la url de tu web para que veamos nosotros tambien el problema y haci poder revisar el codigo

www.listadeespera.eu

icocelebes · 12 Abr 2010, 01:09 · Solicitar retirada

Hola paxarin: En la web jorgens explica el problema de la separación entre la cabezera y el menú, busca en "Curso paso a paso" y lo encontraras.

Raulyure · 12 Abr 2010, 15:16 · Solicitar retirada

paxarin escribió:Muy buenas he realizado unos cambios en la web.
He creado una serie de imagenes, que por un motivo que no consigo saber estan separadas.
Os dejo el html.
:arrow:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Lista de espera sanitaria</title>
<link rel="stylesheet" href="estilos.css" type="text/css" media="all">
</head>
<body>
<div id="logotipo">
[contenido no disponible]
</div>
<div id="cuerpo">
<div id="navegacion">
<ul>

[contenido no disponible]

[contenido no disponible]

[contenido no disponible]

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

Esta Web esta enfocada principalmente para la gente que se encuentre atrapada en alguna lista de espera sanitaria, bien sea para consultas, pruebas hospitalarias o intervenciones quirúrgicas</p>

Aquí encontrareis todo tipo de información sobre este tema, como la constitución española, ley de garantia de la sanidad publica, noticias publicadas en la prensa y un foro de discusión. En el que podreis valorar los temas de la web, asi como expresar vuestros casos y pensamientos sobre este tema. </p>

Amparándonos en la Constitución Española y haciendo uso del articulo 20, esta Web ve la luz con la esperanza de que sirva de ayuda a cualquier persona afectada por este moderno "mal" que recorre ya las principales arterias de nuestro sistema sanitario sin control ninguno.</p>

Espero que con vuestra ayuda y colaboración hagamos posible que este proyecto continué hacia delante.</p>
</div>
<div id="menu">
<ul>
[correo eliminado]
[contenido no disponible]
[contenido no disponible]
[contenido no disponible]
[contenido no disponible]

</div>
<div id="pie">
[contenido no disponible]
</body>
</html>

y la hoja de estilos.
:arrow:
body{background-image:url(objetos/azul.jpg);background-repeat:repeat-x}
img {border-style: none}
#global{width:800px}
#cuerpo {width:800px; float:left; margin: 0px 0px 0px 175px; background:white}
#logotipo{margin:0px 0px 0px 175px}
#navegacion {}
#navegacion li {float:left ; list-style:none}
#navegacion ul {margin-left:0px}
#separador{width:800px}
#contenido{width:500px;float:left;margin:20px }
#menu{width:200px;float:right}
#menu li{float:right; list-style:none}
#menu ul{}
#pie {}

Espero que me podais esplicar el por que.
Un saludo y muchas gracias de antemano.

Hola.
En este momento estoy en una biblioteca y las restricciones no me dejan acceder a su página, así que con los códigos que usted ha puesto en el mensaje me haré una idea de su problema.

Primero.- Veo que usted le ha dado en la hoja de estilo a la capa global un width:800px. pero esa capa no la tiene en su página.

Luego tiene una capa llamada cuerpo a la que le ha dado también 800px de ancho (width)

Pero las imagenes que usted ha puesto como enlaces en la capa navegación (inicio, visitas, enlaces, foros, noticias,contactos) al parecer tienen distinto ancho cada una y puede que la suma de todas ellas supere el ancho de la capa cuerpo (que es de 800px).

Creo que tiene que revisar eso.

Luego a la capa cuerpo usted le ha dado un margin por arriba de 0px, por la derecha de 0px, por abajo de 0px, pero por la izquierda de 175px.
eso haría que la pagina realmente quedara al visualizarla, cargada a la derecha.

Lo mismo le sucede con el logotipo.

Tampoco especifica qué es lo que va dentro de la capa cuerpo, porque si dentro de la capa cuerpo se incluye también la capa pie (que sería lo correcto) debiera de cerrar esa capa cuerpo con un </div> el cual tendría que poner justo debajo del cierre de la capa pie (cierre que tampoco ha puesto)

Yo lo que haría por el momento sería ir a la capa menu (en la hoja de estilo) e incluirle la siguiente directiva (text-align:center).

Luego iría a la capa cuerpo, (también en la hoja de estilo) y le pondría un ancho (width) de 900px (ya que las imagenes que tiene puesto en los enlaces de la capa navegación seguramente sumaran entre ellos casi unos 900px)
También en la capa cuerpo yo le pondría a continuación del width:900px,
un margin4px auto, cosa de que quede así.

body{text-align:center;background-image:url(objetos/azul.jpg);background-repeat:repeat-x}

#cuerpo {width:900px;margin:4px auto; float:left; background:white}

en otra ocasión veremos más detalles.
Saludos

paxarin · 13 Abr 2010, 12:56 · Solicitar retirada

Muchas gracias por tu respuesta, ya hice alguna modificación y estoy revisando el html y la hoja de estilos.