Separación no deseada

Deathly Snake · 7 Abr 2008, 19:45 · Solicitar retirada

Hola a todos !! :wink:

Mi problema es el siguiente:

En mi web inacabada, en varias partes de la web, (el pie y la cabecera) se abre como un pequeño margen en blanco que no puedo eliminar :cry:

Les pongo los codigos a ver si lo resuelven :wink:

En la plantilla y en el index se produce :cry:

index.html:

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="estilos.css" type="text/css" media="all">
</head>

<body bgcolor="#FFFFFF">
<div id="curva-superior">[contenido no disponible]</div>
<div id="global">
<div id="cabecera">
<div id="logotipo">[contenido no disponible]</div>
<div id="publicidad">[contenido no disponible]</div>
</div>
<div id="palabras-clave">
Palabras clave
</div>
<div id="menu">
<div id="menu-superior">
<div id="parte-1">Comenzando</div>
<div id="parte-2">El resumen</div>
<div id="parte-3">MGS3O</div>
<div id="parte-4">La guía</div>
</div>
<div id="menu-inferior">
<div id="parte-5">Creadores</div>
<div id="parte-6">El Foro</div>
<div id="parte-7">Otros Metal Gear</div>
<div id="parte-8">Sobre Metalgearsolid3</div>
</div>
</div>
<div id="contenido">Contenido</div>
<div id="pie">Pie</div>
</div>
<div id="curva-inferior">[contenido no disponible]</div>
</body>
</html>

plantilla.html:

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="estilos.css" type="text/css" media="all">

</head>
<body bgcolor="#FFFFFF">
<div id="curva-superior">[contenido no disponible]</div>
<div id="global">
<div id="cabecera">
<div id="logotipo">[contenido no disponible]</div>
<div id="publicidad">[contenido no disponible]</div>
</div>
<div id="palabras-clave">
Palabras clave
</div>
<div id="menu">
<div id="menu-superior">
<div id="parte-1">Comenzando</div>
<div id="parte-2">El resumen</div>
<div id="parte-3">MGS3O</div>
<div id="parte-4">La guía</div>
</div>
<div id="menu-inferior">
<div id="parte-5">Creadores</div>
<div id="parte-6">El Foro</div>
<div id="parte-7">Otros Metal Gear</div>
<div id="parte-8">Sobre Metalgearsolid3</div>
</div>
</div>
<div id="contenido">
<div id="secciones">
<h1>Las secciones</h1>
<ul>

5
</div>
</div>
<div id="pie">
<div id="pieuno">Pieuno</div>
<div id="piedos">Piedos</div>
<div id="pietres">Pietres</div>
</div>
</div>
<div id="curva-inferior">[contenido no disponible]</div>
</body>
</html>

estilos.css:

body {background-image: url(objetos/fondo.png) ; height:100% }

#global {margin: 4px ; border-left: black 1px solid ; border-right:black 1px solid }
#curva-superior {margin-left: 4px ; margin-right: 4px ; background-image: url(objetos/curva-superior.gif) }
#cabecera {text-align: center ; width: 800px}
#logotipo {background-color: orange ; width: 278px ; float:left }
#publicidad {background-color: gray ; width: 518px ; height:93px ; float:right ; overflow:hidden }
#palabras-clave {text-align: center ; background-color: #66FFFF ; width: 799px ; border-top: black 1px solid}
#menu {text-align: center ; background-color: #66CCFF ; width: 799px}
#menu-superior {}
#parte-1 {width:200px ; float:left ; }
#parte-2 {width:199px ; float:left ; }
#parte-3 {width:199px ; float:left ; }
#parte-4 {width:200px ; float:left ; }
#menu-inferior {}
#parte-5 {width:200px ; float:left ; }
#parte-6 {width:199px ; float:left ; }
#parte-7 {width:199px ; float:left ; }
#parte-8 {width:200px ; float:left ; }
#contenido {background-color: #66FF00 ; height: 300px ; width:799px}
#secciones {background-color: orange ; width: 150px ; float:left ; text-align:center ; margin: 3px 10px 10px 3px ;background-image: url(objetos/menu-parte-inferior.gif); background-position: bottom ; padding-bottom:5px }
#secciones li {list-style:none ; margin: 4px 8px 4px 6px ; text-align:left }
#secciones h1 {text-decoration:none ; font-size:12px ; padding-top:12px ; background-image: url(objetos/menu-parte-superior.gif) ; }
#pie {height: 50px}
#pieuno {float:left ; text-align:center ; background-color: orange ; width: 150px}
#piedos {width:498px ; text-align: center ; background-color:white}
#pietres {float:left ; text-align:center ; background-color:red ; width: 150px}
#curva-inferior {width: 800px ; margin-left: 4px ; margin-right: 4px ;}

Gracias!! :wink:

PD: El fallo se produce en IE explorer y no sé si se producirá en otros navegadores :wink:

RogexdarK · 7 Abr 2008, 20:41 · Solicitar retirada

mira esk tu as separado la parte de la cabecera y la parte de abajo fuera del div global y es por eso q se te separa .. te dejo el codigo ya modificado...:

<html> 
<head> 
<title>Untitled Document</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
<link rel="stylesheet" href="estilos.css" type="text/css" media="all"> 
</head> 

<body bgcolor="#FFFFFF"> 
 
<div id="global"> 
<div id="curva-superior">[img]objetos/curva-superior.png[/img]</div>
<div id="cabecera"> 
<div id="logotipo">[url="index.html"][img]objetos/logotipo.png[/img][/url]</div> 
<div id="publicidad">[img]objetos/publicidad.png[/img]</div> 
</div> 
<div id="palabras-clave"> 
Palabras clave 
</div> 
<div id="menu"> 
<div id="menu-superior"> 
<div id="parte-1">[url="index.html"]Comenzando[/url]</div> 
<div id="parte-2">[url="datos-basicos.html"]El resumen[/url]</div> 
<div id="parte-3">[url="MGS3O.html"]MGS3O[/url]</div> 
<div id="parte-4">[url="la-guia.html"]La guía[/url]</div> 
</div> 
<div id="menu-inferior"> 
<div id="parte-5">[url="creadores.html"]Creadores[/url]</div> 
<div id="parte-6">[url="#"]El Foro[/url]</div> 
<div id="parte-7">[url="otros-metal-gear.html"]Otros Metal Gear[/url]</div> 
<div id="parte-8">[url="sobre-sitiometalgear3.html"]Sobre Metalgearsolid3[/url]</div> 
</div> 
</div> 
<div id="contenido">Contenido</div> 
<div id="pie">Pie</div> 
<div id="curva-inferior">[img]objetos/curva-inferior.png[/img]</div>
</div> 
 
</body> 
</html>

Deathly Snake · 7 Abr 2008, 21:18 · Solicitar retirada

Gracias Roxerdark :wink:

Ahi se arregló el margen separado entre la curva superior y la cabecera

Alguna otra idea para arreglar las otras partes ?

Gracias :wink:

Yaneth · 7 Abr 2008, 21:32 · Solicitar retirada

Hola

yo no veo ninguna separacion

nos puedes indicar donde la ves tu?

saludos

RogexdarK · 7 Abr 2008, 21:34 · Solicitar retirada

Bueno solo tienes q incluirla dentro del div global ( el div q abarca todo ) es la unicaa manera .. a menos q kieras usar tablas.. saludos ..

Deathly Snake · 8 Abr 2008, 00:09 · Solicitar retirada

[contenido no disponible]

Lo marcado en azul, disculpen la gran desprolijidad :oops:

:wink:

RogexdarK · 8 Abr 2008, 00:37 · Solicitar retirada

Pues mira pude solucionarlo pero hay un problema..

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML><HEAD><TITLE>Untitled Document</TITLE>
<META http-equiv=Content-Type content="text/html; charset=iso-8859-1"><LINK 
media=all href="Untitled Document_archivos/estilos.css" type=text/css 
rel=stylesheet>
<META content="MSHTML 6.00.2900.2180" name=GENERATOR></HEAD>
<BODY bgColor=#ffffff>

<DIV id=global>
<DIV id=cabecera>

<table cellpadding="0"  cellspacing="0" height="117" width="804">
<tr>
  <td height="12" colspan="2"><DIV id=curva-superior>[img]Untitled Document_archivos/curva-superior.png[/img]</DIV></td>
  <td width="1" colspan="2"></td>
</tr>
<tr>
  <td width="300" height="103"><DIV id=logotipo>[url="http://metalgearsolid3.freetzi.com/index.html"][img]Untitled Document_archivos/logotipo.png[/img][/url]</DIV></td>
<td width="501">

<DIV id=publicidad style="position:"> aki bla blal bal </DIV></td></tr></table>
</DIV>
<DIV id=palabras-clave>Palabras clave </DIV>
<DIV id=menu>
<DIV id=menu-superior>
<DIV id=parte-1>[url="http://metalgearsolid3.freetzi.com/index.html"]Comenzando[/url]</DIV>
<DIV id=parte-2><A 
href="http://metalgearsolid3.freetzi.com/datos-basicos.html">El 
resumen</A></DIV>
<DIV id=parte-3>[url="http://metalgearsolid3.freetzi.com/MGS3O.html"]MGS3O[/url]</DIV>
<DIV id=parte-4><A href="http://metalgearsolid3.freetzi.com/la-guia.html">La 
guía</A></DIV></DIV>
<DIV id=menu-inferior>
<DIV id=parte-5>[url="http://metalgearsolid3.freetzi.com/creadores.html"]Creadores[/url]</DIV>
<DIV id=parte-6>[url="http://metalgearsolid3.freetzi.com/#"]El Foro[/url]</DIV>
<DIV id=parte-7><A 
href="http://metalgearsolid3.freetzi.com/otros-metal-gear.html">Otros Metal 
Gear</A></DIV>
<DIV id=parte-8><A 
href="http://metalgearsolid3.freetzi.com/sobre-sitiometalgear3.html">Sobre 
Metalgearsolid3</A></DIV></DIV></DIV>
<DIV id=contenido>Contenido</DIV>
<DIV id=pie>Pie</DIV></DIV>
<DIV id=curva-inferior>[img]Untitled Document_archivos/curva-inferior.png[/img]</DIV></BODY></HTML>

Veras tu usas divs y los divs "solos" dan dolores de cabeza en la alineacion asi q te recomiendo usar tablas y envolverlas con divs. como lo he hecho en tu web para darle la alineacion .. ahora la imagen de tu banner .. pues no se yo solo kiero a se ajuste el ancho y se ajustan los dos.. q problemas pero te digo q lo hagas mediante tablas.. saludos

Deathly Snake · 8 Abr 2008, 01:10 · Solicitar retirada

Te lo agradezco mucho Roxerdark :wink:

Pero no me llevo mucho con las tablas jeje

Habrá alguna forma de arreglar el fallo sin el uso de tablas ?

Gracias!! :wink:

RogexdarK · 8 Abr 2008, 01:42 · Solicitar retirada

Pues si la hay y es romperte la cabeza ajustando pixel por pixel (lo digo pork yo eh sufrido para alinear lo q dijiste) .. y es dandole pixel por pixel hasta llegar al tamaño deseado .. pero mayormente se usan tablas y divs para la creacion de una web ordenada y estable.. saludos..

Deathly Snake · 8 Abr 2008, 03:32 · Solicitar retirada

Entonces seguiré tu consejo :lol:

La tabla va dentro del div, o el div va dentro de la tabla?

la 1°ra no?

RogexdarK · 8 Abr 2008, 04:18 · Solicitar retirada

Pues la verdad yo meto la tabla dentro del div osea envuelvo la tabla con el div..y logicamente importo desde css los estilos .. esto facilita cuando querramos actualizar la web .. o cambiarle de diseño . . saludos... cualkier duda sobre tablas .. me las dices..

Deathly Snake · 8 Abr 2008, 04:28 · Solicitar retirada

Que pesado que soy :lol:

Entonces, sería igual que con divs, solo que bien :lol: ?

Gracias! :wink:

RogexdarK · 8 Abr 2008, 04:31 · Solicitar retirada

Ahh .. pues si seria asi no te lo recomendaria.. pues es mejor ya q puedes dividirlo en celdas y solo poner el div adentro ..ya q si pones solo el div pues solo toma referencia del css y lo pone donde se le de la gana.. pero si esta dentro de una celda pues se pone con referencia a la celda.. saludos si tienes mas dudas pues postealas q pa eso estoy... :D

Deathly Snake · 10 Abr 2008, 02:09 · Solicitar retirada

Roxerdark, no sé como agradecerteeeee :wink:

Comenzé a usar tablas y mi web se va recuperando :lol:

Gracias! :wink:

RogexdarK · 10 Abr 2008, 02:13 · Solicitar retirada

Lo veeen tablas y div es la combinacion perfecta.. saludos .. ejjej ..

Deathly Snake · 10 Abr 2008, 02:50 · Solicitar retirada

Yo hago algo asi por ejemplo

<cabecera>
<table>
<tr>
<td>div id="logotipo"><img src="ob bla bla bla </td>
</tr>
</table>

</div>

Así pero mejor hecho jejeje

RogexdarK · 10 Abr 2008, 04:35 · Solicitar retirada

Sep asi puedes alinear el div dentro de la tabla.. para un mejor manejo... xD