Foros del Web » Creando para Internet » CSS »

Problema al centrar la página espacios exteriores

Estas en el tema de Problema al centrar la página espacios exteriores en el foro de CSS en Foros del Web. Buenas resulta que estaba centrando una pagina, como todos sabemos, pero resulta que aparece un margen alrededor del documento ( parte superior e inferior), son ...
  #1 (permalink)  
Antiguo 15/03/2011, 13:26
 
Fecha de Ingreso: marzo-2011
Ubicación: La Paz
Mensajes: 3
Antigüedad: 13 años, 8 meses
Puntos: 0
Pregunta Problema al centrar la página espacios exteriores

Buenas resulta que estaba centrando una pagina, como todos sabemos, pero resulta que aparece un margen alrededor del documento ( parte superior e inferior), son espacios extras que no deberían exister, pero se presentan, he ehecho todo para quitarles, el margin: 0; paddding:0 , etc, pero esos espacios persisten. Alguien puede darme un consejo de como solucionar este problema.

Aui les presento mi código html:



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Template</title>
<link href="estilo.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="contentx">


<div class="navx">
cabecera
</div>

<div class="bodyx" >

hello world - cuerpo
<br />bla <br />bla <br />bla <br />bla
<br />bla <br />bla <br />bla <br />bla
<br />bla <br />bla <br />bla <br />bla
<br />bla <br />bla <br />bla <br />bla
<br />bla <br />bla <br />bla <br />bla
<br />bla <br />bla <br />bla <br />bla
<br />bla <br />bla <br />bla <br />bla
<br />bla <br />bla <br />bla <br />bla
<br />bla <br />bla <br />bla <br />bla
<br />bla <br />bla <br />bla <br />bla
<br />bla <br />bla <br />bla <br />bla

</div>


<div class="footerx">
<div class="vortex-footer">
&copy; pie de pagina
</div>
</div>

</div>
</body>
</html>

Y el respectivo CSS para esta página:

@charset "utf-8";
body{
text-align:center;
padding:0px;

}
div.contentx{
width: 800px;
margin: 0px auto;
border:#FF00FF solid 2px;
}
div.navx{
border:#FF0000 solid 2px;
margin:auto;
height: 100px;
}
div.bodyx{
border:#00FF00 solid 2px;
}
div.footerx{
border:#0000FF solid 2px;
}


Porfavor, que es lo que me hace falta(o sobra) en esto, que algiuen me de algunas luces, las secciones estan divididas en colores, para que lo puedan ver.
  #2 (permalink)  
Antiguo 15/03/2011, 13:29
Avatar de GAST0N  
Fecha de Ingreso: agosto-2010
Ubicación: Buenos Aires
Mensajes: 680
Antigüedad: 14 años, 3 meses
Puntos: 64
Respuesta: Problema al centrar la página espacios exteriores

podriamos ver la pagina??..para entender mejor
__________________
Twitter: @GastonArnedo

Muerte a los <tr> y <td>
  #3 (permalink)  
Antiguo 15/03/2011, 13:31
Avatar de Naahuel  
Fecha de Ingreso: marzo-2011
Ubicación: localhost
Mensajes: 796
Antigüedad: 13 años, 8 meses
Puntos: 192
Respuesta: Problema al centrar la página espacios exteriores

Yo siempre siempre al comenzar un trabajo de maquetado, lo primero que hago es incluir una hoja de reset para CSS:
http://meyerweb.com/eric/tools/css/reset/

Es mi preferida. Lo que hace es "resetear" todos los estilos que aplica el navegador, que siempre son diferentes en cada navegador y dan dolores de cabeza. Incluyendo esos estilos en un reset.css a tu página se soluciona tu problema.
  #4 (permalink)  
Antiguo 15/03/2011, 13:43
 
Fecha de Ingreso: marzo-2011
Ubicación: La Paz
Mensajes: 3
Antigüedad: 13 años, 8 meses
Puntos: 0
Respuesta: Problema al centrar la página espacios exteriores

La imagen de la gina es como se muestra a continuación:

  #5 (permalink)  
Antiguo 15/03/2011, 13:45
Avatar de Naahuel  
Fecha de Ingreso: marzo-2011
Ubicación: localhost
Mensajes: 796
Antigüedad: 13 años, 8 meses
Puntos: 192
Respuesta: Problema al centrar la página espacios exteriores

Crea un nuevo archivo llamado reset.css e incluye lo siguiente ahí:
Código CSS:
Ver original
  1. /* http://meyerweb.com/eric/tools/css/reset/
  2.    v2.0 | 20110126
  3.    License: none (public domain)
  4. */
  5.  
  6. html, body, div, span, applet, object, iframe,
  7. h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  8. a, abbr, acronym, address, big, cite, code,
  9. del, dfn, em, img, ins, kbd, q, s, samp,
  10. small, strike, strong, sub, sup, tt, var,
  11. b, u, i, center,
  12. dl, dt, dd, ol, ul, li,
  13. fieldset, form, label, legend,
  14. table, caption, tbody, tfoot, thead, tr, th, td,
  15. article, aside, canvas, details, embed,
  16. figure, figcaption, footer, header, hgroup,
  17. menu, nav, output, ruby, section, summary,
  18. time, mark, audio, video {
  19.     margin: 0;
  20.     padding: 0;
  21.     border: 0;
  22.     font-size: 100&#37;;
  23.     font: inherit;
  24.     vertical-align: baseline;
  25. }
  26. /* HTML5 display-role reset for older browsers */
  27. article, aside, details, figcaption, figure,
  28. footer, header, hgroup, menu, nav, section {
  29.     display: block;
  30. }
  31. body {
  32.     line-height: 1;
  33. }
  34. ol, ul {
  35.     list-style: none;
  36. }
  37. blockquote, q {
  38.     quotes: none;
  39. }
  40. blockquote:before, blockquote:after,
  41. q:before, q:after {
  42.     content: '';
  43.     content: none;
  44. }
  45. table {
  46.     border-collapse: collapse;
  47.     border-spacing: 0;
  48. }

Luego linkea a esa hoja en tu HTML. Mágica solución. Te recomiendo usar eso siempre, es de gran ayuda :)
-edit-
Demás está decir que debes incluirlo antes de que declares ningún estilo! Sino es contraproducente :P
  #6 (permalink)  
Antiguo 15/03/2011, 13:50
 
Fecha de Ingreso: marzo-2011
Ubicación: La Paz
Mensajes: 3
Antigüedad: 13 años, 8 meses
Puntos: 0
Respuesta: Problema al centrar la página espacios exteriores

He aplicado el reset y funcionó., muchas gracias, pero no en todos los navegadores.

Etiquetas: espacios, exteriores, extras
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 09:25.