28173 sujets

CSS et mise en forme, CSS3

Mystère FireFox

Salut tout le monde, Voici mon site http://nekobarbare.free.fr
Comme vous pouvez le voir il marche bien sur IE7, mais sur firefox c'est la galère.
Grace à l'aide de ghost j'ai résolu le pb du centrage grace a
margin:0 auto;
appliqué au bloc dg et pour le texte aligné , j'ai rajouté un:

margin-left:xx px;
au bloc contenu centre.
Mon soucis actuel , c'est que contrairement a IE sous firefox ,lorsque la page s'agrandi , le texte contenu centre , déborde de son conteneur "contenu_page" sans que celui ci s'agrandisse..comme le fait spontanément IE...
J'ai essayer en rajoutant background-repeat, mais ca ne fonctionne pas , et overflow:auto , c'est pas le résultat désiré...
J'en viens à la question suivante, où sont mes erreurs...
Merci de votre aide
Bonsoir rockt13,

Pour résoudre ton problème sous Firefox :

div#contenu_centre {
background-image:url(img/contenu_centre.jpg);
float:left;
[#red]height:419px;[/#] [#blue]à supprimer[/#]
position:relative;
top:-3px;
}

Sans doute devras-tu modifier un peu les paramètres de positionnement de ta zone "login" :

.login {
clear:both;
float:right;
[#red]height:35px;[/#] [#blue]ne sert pas à grand chose...[/#]
[#red]margin-right:55px;[/#] [#blue]par exemple, voir ce que cela donne avec IE6...[/#]
margin-top:5px;
position:relative;
width:150px;
}

Mais tu peux également positionner de cette manière :

.login {
width:150px;
position:absolute;
[#blue]right:60px;
bottom:10px;[/#]
[#blue]*à modifier à ta convenance[/#]
}

Compatible Firefox, IE7 et IE6.

Ceci étant dit, ta feuille de style est "un poil bordélique", et à terme, je ne sais pas comment tu pourras gérer efficacement cette dernière...
Il ne serait pas inutile de mieux "structurer" ta feuille de style, mais surtout de passer ton code et ta feuille de style au validateur, cela te permettrait de corriger quelques erreurs (non, float:center n'existe pas...border:1 non plus... Smiley cligne ) les scrollbars ne fonctionnent que sous IE, ton code ne fonctionne donc pas sous les autres navigateurs et n'est donc pas valide...
Bref, quelques erreurs que tu pourras corriger aisément...

Bonne fêtes de fin d'année.
Administrateur
6l20 a écrit :

Pour résoudre ton problème sous Firefox :

div#contenu_centre {
background-image:url(img/contenu_centre.jpg);
float:left;
[#red]height:419px;[/#] [#blue]à supprimer[/#]
position:relative;
top:-3px;
}


Height pour Firefox sur un div n'est en effet pas habituel. Seul IE6 a en général besoin de cela hors cas particulier (height pour IE6 via un commentaire conditionnel).

min-height peut ou non être nécessaire selon ce que tu cherches à faire. Le div suivant (footer?) peut avoir besoin d'une instruction clear: both; si le contenu principal semble dépasser dans le footer.

En général il est *fortement* conseillé de développer son site en premier pour Firefox (et Firebug Smiley bignoel ) ou Opera ou Safari et ensuite seulement pour IE6 et IE7.


EDIT: on ne peut trouver que <head> ou <body> dans l'élément <html>, pas <script> Smiley cligne
Modifié par Felipe (27 Dec 2007 - 07:31)
Salut Felipe et 6|20 , tout d'abord merci pour votre attention.
J'ai suivi vos conseils , 

.login {
width:150px;
position:absolute;
right:60px;
bottom:10px;
}

Voila pour le login et enfin pour contenu centre

div#contenu_centre {
background-image:url(img/contenu_centre.jpg);
float:left;
position:relative;
top:-3px;
}

Maintenant mon site ressemble enfin à qque chose.
Il me reste à régler le probleme d'affichage des images dans la gallerie qui déborde sous Firefox , sans doute une histoire de height fixe encore.. je vous tiens au jus ! En tout cas merci de votre aide Smiley cligne
Voila sujet , résolu , site en ligne , j'ai corrigé pas mal de faute grace au validator sur ma css ( il reste juste les scrollbar-color , mais je le laisse car pour ceux qui on IE ca reste jolie )
Sinon c'est vrais que cest le foutoir dans ma feuille ( et dans mon site entier même)
Enfin , je vais quand même un peut relire mes bouquin de CSS, car du coup , j'ai des ptits flou avec mes position :absolute .... par rapport au contenant..?.. etc...
ENfin Merci de votre aide !!!!
Et à la prochaine pour de nouvelles questions lol
Bonne fêtes
Sujet clos
Aller à