28173 sujets

CSS et mise en forme, CSS3

Problème de ''margin-top'' sous browser (Firefox-Opera-Netscape)

Bonjour tous,

Je suis nouveau ici et je commence a m'intéresser au xhtml-css.

Mon problème c'est le ''margin-top'' sous les browser (Firefox-Opera-Netscape...)

( margin-top: 0px; ) semble ne pas marcher sur ces browsers et je me demandais si ce problème est résolvable car présentement j'ai essayé bien des choses mais rien ne semble fonctioner.

voici mon code xhtml:

<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Document sans titre</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="yo.css" rel="stylesheet" type="text/css" />
</head>

<body>
        <div id="page">  
                <p><img src="left_banner_top.gif" width="124" height="250" /><img src="logo.jpg" width="250" height="250" /><img src="right_banner_top.gif" width="117" height="250" /></p>
        </div>
</body>

</html>


Voici le code CSS:


body{
    padding : 0;
    margin : 0;
    background-image : url(background.gif);
    background-position: 50% 50%;
    background-repeat : repeat-y;}
	body

#page { 
        width: 500px;
        margin-top: 0px;
        margin-left: auto; 
        margin-right: auto; 
        }


Voici le url:

http://www.socam.net/center

Merci,

Alec Eiffel
Modifié par Alec Effeil (04 Jun 2007 - 19:47)
Administrateur
Bonjour et bienvenue parmi nous Smiley smile

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle. Smiley cligne

D'ailleurs, je rappelle que le lien qui apparaît en bandeau tout en haut du forum ("Nouveau sur le forum ?...") est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Il serait courtois de ta part de bien vouloir en prendre connaissance.

Bonne continuation Smiley smile

upload/1-code.gif
Bonjour,

Pour commencer : ta page a-t-elle un Doctype valide (placé avant la balise <html>) ? Si non, il faut commencer par là.

Ensuite, il s'agit à priori d'un problème de fusion des marges : la marge du paragraphe se transmet à div#page, ce dernier n'étant pas flottant et n'ayant pas de padding-top ou de border-top.

Plus d'informations à ce sujet :
http://web.covertprestige.info/test/04-blocs-imbriques-et-fusion-des-marges.html

Bonne continuation. Smiley smile


PS : n'oublie pas de tenir compte de la remarque de Raphael.
Rebonjour,

J'ai édité mon message et merci pour l'info Florent seulement, j'ai lu la page mais j'ai toujours pas réussi à réglé mon problème.

J'ai essayé une toute autre façon de coder la même page mais cette façon de faire me cause aussi un autre problème d'images qui ne reste pas en place lorsque la page du browser est redimenssioner manuellement pas le visiteur.

J'ai donc créé un autre ''thread'' pour faire part de mon problème étant donné qu'il diffère de celui ci.

Merci,

Alec
Il faut supprimer le prologue XML qui fait passer IE6 en mode Quirks (en plus d'être peu pertinent pour du XHTML servi en mode "text/html").
Sujet clos
Aller à