Foros del Web - Div pegado a la parte superior de la página

Foros del Web (http://www.forosdelweb.com/)

- CSS (http://www.forosdelweb.com/f53/)

- - Div pegado a la parte superior de la página (http://www.forosdelweb.com/f53/div-pegado-parte-superior-pagina-379887/)

JavierB

21/03/2006 03:34

Div pegado a la parte superior de la página

Hola a todos.

Quiero que un div quede totalmente pegado a la parte de arriba de la página. Con el código que os pongo queda bien en Internet Explorer, pero en Firefox deja un espacio, como si tuviera un margen superior:

Código:

<html>

<head>

<style type="text/css">

body, html {margin:0; padding:0}

#contenedor {

  width:500px;

  margin:auto;

  border-left:1px solid black;

  border-right:1px solid black  }

</style>

</head>

<body>

<div id="contenedor">

<p>Aquí va el texto</p>

</div>

</body>

</html>

¿Se os ocurre algo para solucionarlo?

Gracias por adelantado. Saludos, :adios:

uamistad

21/03/2006 04:08

Hola JavierB, si cambias tu border-left y border-top por un simple border, se puede ver que sí estás pegando bien el DIV a la parte superior de la página.

El problema son tus etiquetas que hacen que el texto baje un poco.

JavierB

21/03/2006 05:03

Hola uamistad. Gracias por contestar.

Ya me había fijado que poniendo border-top si que queda bien, pero me gustaría saber si hay alguna forma de que quede pegado sin poner borde superior.

No le mencioné en mi anterior mensaje ni lo puse en el código, pero el DOCTYPE está puesto y bien puesto, así que parece que el problema no es ese.

Gracias de nuevo. Saludos, :adios:

kahlito

21/03/2006 10:36

Hola JavierB.

Prueba poniéndole un margen superior al texto o parrafo de 0 por ejemplo:

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>Documento sin t&iacute;tulo</title>
 <style type="text/css">

body, html {margin:0; padding:0}

#contenedor {

  width:500px;

  margin:auto;

  border-left:1px solid black;

  border-right:1px solid black;

  }

 p {

        margin-top: 0;

}
 </style>
 </head>
 <body>
 <div id="contenedor">
 <p>Aquí va el texto</p>
 </div>
 </body>
 </html>

Y si no pues con una clase a "p" para que solo este texto se quede arriba.

Espero que sea eso :arriba:

ZMaster

21/03/2006 11:00

Hola!

Por qué en lugar de P utilizas Texto aquí y asunto arreglado mi amigo. Hay que ser prácticos en esto que no es un sistema de información el que estas creando.

Be happy!

JavierB

21/03/2006 11:09

Gracias kahlito, me ha funcionado de maravilla tu código. Había probado poniendo margin y padding a cero por todas partes, pero se ve que me faltó eso. :arriba:

ZMaster: estoy intentando que mi código sea lo más estandar posible y pones un así suelto no es correcto. Gracias de todas formas.

Saludos, :adios:

kahlito

21/03/2006 11:40

De nada JavierB, recuerda que la hora de la merienda "eh mu mala" ;-)

Saludosss :adios:

La zona horaria es GMT -6. Ahora son las 08:18.