Décalage de texte sous firefox.

Fermé
flyzi Messages postés 79 Date d'inscription mardi 19 juin 2007 Statut Membre Dernière intervention 21 décembre 2010 - 16 nov. 2008 à 19:42
vdfinternet Messages postés 469 Date d'inscription samedi 15 mars 2008 Statut Membre Dernière intervention 4 janvier 2014 - 18 nov. 2008 à 19:09
Bonjour,

Je n'arrive pas à trouver l'origine du décalage du texte présent dans mon "sidebar"sur firefox.
Ce décalage ne s'effectue que sur firefox et pas sur IE.

Voici mon site :

http://projets.iut-info-vannes.net/pjew/courant/europe/europe_d1/doku.php

merci d'avance.
A voir également:

5 réponses

flyzi Messages postés 79 Date d'inscription mardi 19 juin 2007 Statut Membre Dernière intervention 21 décembre 2010 3
16 nov. 2008 à 20:57
up

quelqu'un peut m'aider?

Merci d'avance
0
caporay Messages postés 61 Date d'inscription mardi 27 novembre 2007 Statut Membre Dernière intervention 29 novembre 2010 3
16 nov. 2008 à 21:23
juste en dessous de ta ligne <title>LaMaisonDeLEuropeVannes » accueil</title> insere ce code


<!--
html, body {
margin: 0;
padding: 0;
text-align: center;
}
#conteneur {
position: relative;
margin: auto;
width: 900px;
text-align: left;
}

puis juste après la balise <body>, insere ceci:

<div id="conteneur">

et ensuite juste avant </body> ferme la div en insérant:


</div>



je crois que ca pourai aller
0
flyzi Messages postés 79 Date d'inscription mardi 19 juin 2007 Statut Membre Dernière intervention 21 décembre 2010 3
18 nov. 2008 à 18:04
ça n'a pas fonctionné.

D'autres idées?


merci d'avance.

ps voici mon css:

/* ================================ GENERAL ================================= */
html, body
{
margin: 0;
padding: 0;
min-height: 100%;
font-size: 13px; /* Resets 1em to 10px, do NOT modify this! */
font-family: "Lucida Grande", Verdana, Arial, Sans-Serif;
}

body
{
margin: 0 0 0 0;
background: #0000b3 url("images/fond.png") repeat-x top left;


}

a:link,
a:visited {
color: #0000b3;
text-decoration: none;
}

a:hover,
a:active {
color: #000000;
text-decoration: underline;
}

.wikilink1 {color: #000000;}
.wikilink2 {color: #000000;}

a img { border: none; }

ol
{
line-height: 1.5em;
margin: 0;
padding: 0;
}

ul
{
list-style-type: square;
margin: 0;
padding: 0;
list-style-image: url(images/doblebullet.gif);
}

html> body> #wrapper
{
width: 1200px; /*largeur du bloc central*/
margin: auto;
background: #5656cd url(images/bg_wrapper.gif) repeat-x top left;
border: 1px solid #0000b3; /*bordure cadre principal*/
}

html> body> #dokuwiki
{
width: 740px;
margin:auto;
background-color: #fff;
}

/* ================================ HEADER ================================== */


#header
{
text-align: center;
height: 230px;
width: 950px; /*largeur de header*/
margin:auto;
background: url(images/header.png) no-repeat top right;
}
#header a {margin: 0px; padding: 0px; border: none}



#defil
{
text-align: center;
width: 1200px;
background: #5656cd url(images/barre.png) repeat-x top left;
padding:0;
margin:0;
padding-top:25px;
}

#menuetrecherche
{
width:1200px;
height: 80px;
background: #5656cd url(images/menurecherche.png) repeat-x top left;
padding-top:25px;

}


.search
{
float: right;
width: 220px;
margin-top:4px;
}
.search input {width: 110px;background-color: #CFE8F7;}
.search .button {width: 90px; margin-left:4px}
.search .button:hover {border: solid 1px #000;}
.search form
{
border: none;
text-align: center;
}
/* ================================= MENU principal (menup) =================================== */



#menup, #menup ul /* Liste */
{
padding : 0px; /* pas de marge int�rieure */
margin : 0px; /* ni ext�rieure */
list-style : none; /* on supprime le style par d�faut de la liste */
line-height : 30px; /* on d�finit une hauteur pour chaque �l�ment */
text-align : center; /* on centre le texte qui se trouve dans la liste */
}

#menup /* Ensemble du menu */
{
font-weight : bold; /* on met le texte en gras */
font-family : Arial; /* on utilise Arial */
font-size : 15px; /* hauteur du texte : 15 pixels */
float:right;
margin-right:10px;
margin-top:2px;


}

#menup a /* Contenu des listes */
{
display : block; /* on change le type d'�l�ment, les liens deviennent des balises de type block */
padding : 0; /* aucune marge int�rieure */
background : #F5FE00; /* couleur de fond */
color : #0033FE; /* couleur du texte */
text-decoration : none; /* on supprime le style par d�faut des liens (la plupart du temps = soulign�) */
width : 144px; /* largeur */
}

#menup li /* Elements des listes */
{
float : left;
/* pour IE qui ne reconna�t pas "transparent" */
border-right : 1px solid #fff; /* on met une bordure blanche � droite de chaque �l�ment (était antérieurement transparent "solid transparent") */

}

/* IE ne reconnaissant pas le s�lecteur ">" */
html>body #menup li
{
border-right: 1px solid #fff; /* on met une bordure en blanc � droite de chaque �l�ment */
border-left: 1px solid #fff; /* on met une bordure en blanc � gauche de chaque �l�ment */
}

#menup li ul /* Sous-listes */
{
position: absolute; /* Position absolue */
width: 100px; /* Largeur des sous-listes */
left: -999em; /* on envoie loin du champ de vision */
}

#menup li:hover ul, #menup li li:hover ul, #menup li.sfhover ul, #menup li li.sfhover ul /* Sous-listes lorsque la souris passe sur un �l�ment de liste ET sous-sous-lites lorsque la souris passe sur un �l�ment de sous-liste */
{
left: auto; /* Repositionnement normal */
min-height: 0; /* Corrige un bug sous IE */
}


#menup li ul li /* �l�ments de sous-listes */
{
border-top : 1px solid #fff; /* on met une bordure blanche en haut de chaque �l�ment d'une sous liste */
border-bottom : 1px solid #fff; /* on met une bordure blanche en bas de chaque �l�ment d'une sous liste */
}


#menup a:hover /* Lorsque la souris passe sur un des liens */
{
color: #F5FE00;
background: #0033FE;
}

sfHover = function() {
var sfEls = document.getElementById("menup").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

/* ================================== SIDE ================================== */
.menu .li {display: inline}

.sidebar
{
width: 200px;
float: left;
text-align: center;
color: #ffffff;

background: #ffffff url(images/menuadmin.png) repeat-x top left;
border: 1px solid #0000b3; /*couleur bordure principale sidebar*/
margin-left:20px;

}


.sidebar ul {margin: 0px;; margin-bottom:10px; text-align:left;}
.sidebar li
{
list-style:none;
background: #fff url(images/doblebullet.gif) no-repeat center right;

border: 1px solid #0000b3;
height:20px;
margin:0 0 5px 0;
}

.actions
{
border: 1px solid #0000b3; /*cadre du sidebar (qui entoure les boutons d'administration)*/
background: #ffffff url(images/fondbody.png) repeat-x top left;
width: 160px;
text-align: center;
color:#0000b3; /*couleur texte dans cadre administration site*/
margin:auto;

}


/* ================================= CONTENT ================================ */
#Content
{

float:right;
margin-right:20px;
padding-top:10px;
padding-left:20px;
padding-right:20px;
width:880px;
color: #000000;
line-height: 20px;
background: #ffffff url(images/fondbody.png) repeat-x top left; /*fond d�grad� jaune vers blanc dans bloc � droite de sidebar*/
border: 1px solid #0000b3;
}

#Content a {text-decoration: none}
#Content a:hover {text-decoration: underline}

/* ================================== BODY ================================== */
#body
{
margin: 0px auto;
background-color: transparent;
color: #000;
}

#body_top, #body_bottom
{
height: 0px;
background-color: transparent;
color: #000;
}

#body h1, #body h2, #body h3, #body h4, #body h5, #body h6
{
font-family: "Trebuchet MS", Tahoma, Arial, Sans-Serif;
color: #000000;
}

#body h1 { font-size: 2em; }
#body h2 { font-size: 1.8em; }
#body h3 { font-size: 1.6em; }
#body h4 { font-size: 1.4em; }

#body h1 a:hover, #body h2 a:hover, #body h3 a:hover, #body h4 a:hover, #body h5 a:hover, #body h6 a:hover
{
text-decoration: none;
}


#body input {border: solid 1px #FFF00;}


#body .sidebar h2{border-bottom: none; font-size: 1em;}


.code, .file
{
border: 1px dashed __code_border__;
background-color: __code__;
padding: 5px;
overflow: auto;
}
.code, .code *
{
font-size: 1em;
font-family: "Courier New",Courier,monospace;
}

/* ============================= DOKUWIKI LEVELS ============================ */
#body h1 { margin-left: 0em; }
div.level1 { margin: 1em 0 0 0; }
#body h2 { margin-left: 1em; }
div.level2
{
margin: auto;
padding-right:100px;
}
#body h3 { margin-left: 2em; }
div.level3 { margin: 1em 0 0 3em; }
#body h4 { margin-left: 3em; }
div.level4 { margin: 1em 0 0 4em; }
#body h5 { margin-left: 4em; }
div.level5 { margin: 1em 0 0 5em; }


/* ================================== TABLE ================================== */
#body table
{
border: solid 1px #999;
margin:auto;
border-collapse: collapse;

}



#body table th
{
border: solid 1px #999; background-color: #eee;
padding: 2px 2px 2px 2px;
}

#body table td
{
border: solid 1px #ccc; background-color: #fff;
padding: 2px 0 2px 2px;


}

#body table tr:hover { background-color: #ffffe5; }
#body table td.rightalign { text-align: right; }
#body table td.centeralign { text-align: center; }
#body table td.leftalign { text-align: left; }

.gallery, .gallery tr, .gallery td { border: 5px solid #fff }
#body .gallery td { border: 1px solid #fff }

/* ================================= FOOTER ================================= */
#footer
{
clear: both;
text-align: center;
height: 80px;
width: 1200px;
margin: 0px auto;
background: #0000b3 url(images/menurecherche.png) repeat-x top left;
border: 1px solid #0OOOb3;
color: #0000b3;
padding-top:30px;
margin:auto;
}

#footer li { display: inline;}
#footer ul { padding: 0;margin-top: 15px;}

#footer li a
{
color: #000000;
font-weight: bold;
}
#footer li a:hover
{
color: #dedede;
text-decoration: none;
}


/* ==================================== RSK =================================== */
/* ================================== BUTTONS ================================== */
.button .no{float: right; margin-bottom:3px}
.button
{
background: #fff url(images/buttonshadow.png) repeat-x bottom;
border: none;
}

/* ================================== TOC ================================== */
/* TOC control */
#dokuwiki div.toc {float: left;}
#dokuwiki div.tocheader {text-align: right;}
#dokuwiki #toc__inside {text-align: right;}

#dokuwiki ul.toc
{
padding: 0;
padding-right: 1em;
}

#dokuwiki ul.toc li
{
background-position: right 0.6em;
padding-right:0.4em;
direction: rtl;
}

#dokuwiki ul.toc li.clear{padding-right:0.4em;}
#dokuwiki pre {text-align: left;}

#dokuwiki div.toc
{
margin: 1.2em 0 0 2em;
float: right;
width: 200px;
font-size: 80%;
clear: both;
}

#dokuwiki div.tocheader
{
border: 1px solid __border__;
background-color: __background_alt__;
text-align: left;
font-weight: bold;
padding: 3px;
margin-bottom: 2px;
}

#dokuwiki span.toc_open,
#dokuwiki span.toc_close
{
border: 0.4em solid __background_alt__;
float: right;
display: block;
margin: 0.4em 3px 0 0;
}

#dokuwiki span.toc_open span, #dokuwiki span.toc_close span{display: none;}

#dokuwiki span.toc_open
{
margin-top: 0.4em;
border-top: 0.4em solid __text__;
}

#dokuwiki span.toc_close
{
margin-top: 0;
border-bottom: 0.4em solid __text__;
}

#dokuwiki #toc__inside
{
border: 1px solid __border__;
background-color: __background__;
text-align: left;
padding: 0.5em 0 0.7em 0;
}

#dokuwiki ul.toc
{
list-style-type: none;
list-style-image: none;
line-height: 1.2em;
padding-left: 1em;
margin: 0;
}

#dokuwiki ul.toc li
{
background: transparent url(images/tocdot2.gif) 0 0.6em no-repeat;
padding-left: 0.4em;
}

#dokuwiki ul.toc li.clear
{
background-image: none;
padding-left: 0.4em;
}

#dokuwiki a.toc:link, #dokuwiki a.toc:visited {color: __existing__;}

#dokuwiki a.toc:hover, #dokuwiki a.toc:active {color: __text__;}



/* ================================== TOOLBAR ================================== */
button.toolbutton
{
background-color: __background__;
padding: 0px;
margin: 0 1px 0 0;
border: 1px solid __border__;
cursor: pointer;
}

/* nice alphatransparency background except for IE <7 */
html>body button.toolbutton
{
background: #fff url(images/buttonshadow.png) repeat-x bottom;
border: 1px solid #ecf4d9;

}

div.picker
{
width: 250px;
border: 1px solid #ecf4d9;
background-color: __background_alt__;
}

button.pickerbutton
{
padding: 0px;
margin: 0 1px 1px 0;
border: 0;
background-color: transparent;
font-size: 80%;
cursor: pointer;
}

textarea
{
border: 1px solid #dedede;
background-color: #fafafa;
width: 870px; /*largeur du éditer du dokuwiki (cadre)*/
font-size: 90%;
}
/* =================================== BLOG ==================================== */
#dokuwiki div.inclmeta
{
width: 450px;
padding-left: 20px;
padding-right: 10px;
border: 1px solid #FF0000;
background-color: #faffee;
margin-bottom: 40px;
margin: 0px auto;
color: #dee7c4;
text-align: left;
}
#dokuwiki div.inclmeta a {font-size:10px}

#aaaContent .aaahentry
{
background: url(images/tribal.gif) no-repeat bottom center;
padding-bottom: 60px;
margin-bottom: 20px;
}

#dokuwiki div.inclmeta span.comment
{
background: transparent url(images/ico/comment.png) 0px 1px no-repeat;
padding: 0px 0px 1px 20px;
}
#dokuwiki div.inclmeta abbr.published
{
font-size: 11px;
padding: 1px 0px 1px 20px;
border-bottom: 0;
}
#dokuwiki div.inclmeta span.author
{
background: transparent url(images/ico/user.png) 0px 1px no-repeat;
padding: 1px 0px 1px 20px;
}
#dokuwiki div.tags {display: inline;float: right;}
#dokuwiki div.tags span
{
background: transparent url(images/ico/tag.png) 0px 1px no-repeat;
padding: 1px 0px 1px 20px;
display: inline;
}
#dokuwiki div.inclmeta a.permalink
{
background: transparent url(images/ico/permalink.png) 0px 1px no-repeat;
padding: 1px 0px 1px 20px;
}


/* ================================== DISCUSSION ==================================== */
#Content .comment_wrapper {padding-top: 20px; margin-top: 50px; background: url(images/tribal.gif) no-repeat top center;}
#discussion__comment_text {width: 475px}

#Content .comment_wrapper .comment_head
{
background-color: #fff;
background: #fff url(images/comment-head.gif) no-repeat bottom left;
height: 60px;
margin: 0px;
width: 450px;
}
#Content .comment_wrapper .entry_content {padding: 0px; margin: 0px}

#Content .comment_wrapper .comment_body
{
text-align: left;
margin: 0px; padding: 0px;
background-color: #fafafa;
border-bottom: 1px solid #d1d1d1;
border-left: 1px solid #d1d1d1;
border-right: 1px solid #d1d1d1;
border-top: 1px solid #fafafa;
width: 450px;
}
#Content .comment_wrapper .comment_body p {padding: 10px; color: #6D6D6D}
#Content .comment_wrapper .comment_form
{
margin-top: 50px;
text-align: right;
}

/* ================================== OTHER ==================================== */
.medialeft
{
padding: 8px;
}

.breadcrumbs
{
font-family: Verdana;
font-size: 10px;
margin-bottom: 15px;
text-align: left;
}
.center
{
text-align: center;
margin: 0px auto;
}
.buttons ul {padding: 0px; margin: 0px; list-style: none; margin-top: 20px}
.buttons li{display: inline; padding: 0px; margin: 0px;}
.buttons li .li {display: inline}

.tribal
{
background: #fff url(images/tribal.gif) no-repeat bottom center;
padding-bottom: 60px;
margin-bottom: 20px;
}
0
flyzi Messages postés 79 Date d'inscription mardi 19 juin 2007 Statut Membre Dernière intervention 21 décembre 2010 3
18 nov. 2008 à 18:45
En faite le texte de mon sidebar a un décalage d'environ 20px en hauteur ( sur firefox). Sur IE, le texte est collé en haut des cadres du sidebar.

D'où vient ce décalage??


Merci d'avance.
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
vdfinternet Messages postés 469 Date d'inscription samedi 15 mars 2008 Statut Membre Dernière intervention 4 janvier 2014 38
18 nov. 2008 à 19:09
Salut !

C'est la gestion du css par les navigateurs. Essaye Avec Opera, Chrome, Safari, Explorer ... Aucun ne réponds pareil !!!

Le mieux et de savoir que quasi la totalité des visiteur se balade avec explorer de 65% à 85% ça dépend des jours. Mozilla Bug a mort depuis la fin de l'été et va mourir je crois a cause de Google Chrome. Il faut optimisé sur Explorer et voir si ça passe sur les autre.

La solution pro est de créer un css simple, aux normes de compatilitées pour les mobiles car c'est la suite du site Web !
0