Sujets similaires

Dernière édition par Nono le Sam 02 Mar 2013, 12:57, édité 1 fois

Bonjour et merci d'avance à la personne qui viendra me répondre ^^

J'ai suivi le tuto pour mettre une bannière aléatoire. Très bon tuto, qui marche très bien ^^
Mais j'ai remarqué que ma bannière n'est plus placé comme il le faudrait. celle-ci c'est décalé de quelques pixel sur la droite. Je ne vois pas du tout d’où ça peut venir.

Le mieux est de voir par vous même mon forum de test : http://testgraphnono.forumperso.com/

Voici le code javascript :

Code:: var banner = new Array();

banner[0]='http://img15.hostingpics.net/pics/255088bannireadamjill.png';
banner[1]='http://img15.hostingpics.net/pics/479180bananamarkus.png';
banner[2]='http://img15.hostingpics.net/pics/273516banmarshalalice.png';
banner[3]='http://img15.hostingpics.net/pics/863318bannireLyrajimmy.png';

document.getElementById('i_logo').src= banner[Math.floor(Math.random()*banner.length)];

Au besoin, je vous mets le CSS, mais je ne pense pas que ça vienne de là, mais bon je ne suis pas une experte.

Code:: body
{
/*background-image: url("http://img15.hostingpics.net/pics/255088bannireadamjill.png")*//*, url("http://img15.hostingpics.net/pics/736264solid.png")*/;
background-repeat: no-repeat, repeat;
background-position: center 20px;
}

.row2{background : #190e0e!important;}
.sujets .row2{background: #b9a497!important;}

/*Présentation du Profil*/
.atelierprof {
padding:10px;
/*text-transform:uppercase;*/
background-color:#5a3f39;
}

.pseudo_membre{
font-size: 15px;
text-shadow : 1px 1px 3px #020202;
}

.bodylinewidth{
margin-top:-9px;
margin-bottom:-9px;
}

/*arrondis zones de saisie identifiant*/
input,textarea, select { border: 1px solid #bbbbbb;
box-shadow: 0px 2px 3px #909090;
background-color: #ece5d9;
font-size: 12px;
margin: 3px; }

textarea { margin-left: 0; margin-right:0; }

/*CODE*/
.code{
font-family: Courier,Courier New,sans-serif;
font-size: 11px;
color: #000000;/*texte*/
background-color: #b7a196;/*fond*/
border: #ccc1ba;/*bordure*/
border-style: solid;
border-left-width: 7px;
border-top-width: 0px;
border-right-width: 7px;
border-bottom-width: 0px;
padding:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
}

/*CITATION*/
.quote{
font-family: Tahoma;
font-size: 12px;
color: #000000;
line-height: 125%;
background-color: #b7a196;
border: #ccc1ba;
border-style: solid;
border-left-width: 6px;
border-top-width: 0px;
border-right-width: 6px;
border-bottom-width: 0px;
padding:7px;
-moz-border-radius:6px;
-webkit-border-radius:6px;}

/*SPOILER*/
.spoiler{
font-family: verdana;
font-size: 11px;
color: #FFF6D8;
line-height: 100%;
background-color: #b7a196;
border: #ccc1ba;
border-style: solid;
border-left-width: 6px;
border-top-width: 0px;
border-right-width: 6px;
border-bottom-width: 0px;
padding:7px;
}

.selectCode { float:right; text-transform: uppercase; cursor:pointer; }/*selection du code*/

.catHead { border: none !important;} /*retire la couleur cadre catégorie*/
.catBottom { border: none !important;}
.thLeft { border: none !important;}
.thRight { border: none !important;}
.row3Right { border: none !important;}

/*retire bordure gênante*/
.row3Right
{
border: none !important;
}
.thHead
{
border: none !important;
}
.thCornerL, .thCornerR, .thTop
{
border: none !important;
}
.thLeft, .thRight
{
border-left: none !important;
border-right: none !important;
}
.catLeft, .catRight
{
border: none! important;
}
.catHead
{
border: none !important;
}
.catBottom
{
border: none !important;
}/* fin*/

.forumline
{
width: 100%;
margin-left: auto;
margin-right: auto;
margin-top: 10px;
margin-bottom: 10px;
background: #190e0e;
border: 3px solid #441b21;
/*box-shadow: 0px 0px 5px #595959;
-moz-box-shadow: 0px 0px 5px #595959;
-o-box-shadow: 0px 0px 5px #595959;
-htm-box-shadow: 0px 0px 5px #595959;
-webkit-box-shadow: 0px 0px 5px #595959;*/
}
table
{
margin: auto;
}

#page-body /* correction bug*/
{
width: 850px;
margin: auto;
}

/* Barre de navigation*/
#navigation
{
position: fixed;
z-index: 999;
height: 30px;
width: 100%;
margin-left: -8px;
}
#navig
{
width: 100%;
margin: auto;
text-align: center;
background: #190e0e;
border-bottom: 2px solid #441b21;
padding-bottom: 3px;
}
#navig a
{
font-weight: bold;
color: #baa59a;
}
/*fin barre de navigation*/

/*Catégorie*/
a.nav img
{
width: 200px;
}
.cate_titre
{
width: 98%;
margin: auto;
text-align: center;
}
.categorie
{
width: 98%;
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
background: #441b21;
border: 3px solid #441b21;
/*box-shadow: 0px 0px 5px #595959;
-moz-box-shadow: 0px 0px 5px #595959;
-o-box-shadow: 0px 0px 5px #595959;
-htm-box-shadow: 0px 0px 5px #595959;
-webkit-box-shadow: 0px 0px 5px #595959;*/
}
.forum
{
width: 98%;
margin-left: auto;
margin-right: auto;
margin-top: 5px;
margin-bottom: 5px;
background: #190e0e;
padding: 2px;
}
.forumlink
{
display: block;
width: 600px;
font-variant: small-caps;
letter-spacing: 2px;
padding-left: 20px;
text-shadow: 1px 1px 0px #ffffff;
}

.forumlink a
{
font-size: 16px;
border-bottom: 2px solid #b0988c;
text-decoration: none !important;
}
.description
{
display: block;
width: 500px;
margin: auto;
font-size: 11px;
text-align: justify;
color: #8f6666;
}

.illu
{
float: right;
margin-left: 10px;
margin-bottom: 10px;
border: 1px solid #c0c0c0;
background: #e9e9e6;
padding: 5px;
}

.stats_last
{
display: block;
width: 150px;
margin: auto;
background: #baa89a;
border: 1px solid #140b0b;
}

.stats
{
display: block;
text-align: center;
font-size: 10px;
color: #403332/*706d6d*/;
border-bottom: 1px solid #140b0b;
padding-bottom: 4px;
margin-bottom: 4px;
}
.last
{
display: block;
text-align: center;
font-size: 11px;
}
.sous_forum
{
display: block;
width: 98%;
margin: auto;
background: #b0988c;
padding: 2px;
text-align: center;
}/* Fin*/

.nsujets{ /*mise en forme du "ecrit par ..."*/
}

/*Profil derrière l'avatar*/

/* Code par Hiro pour CSSACTIF
Merci de ne pas supprimer cette mention
(http://www.css-actif.com) */

#englob { /* Encadrement global des 2 divs */
position:relative;
width:200px;
height:320px;
/*border:1px solid red; La vilaine bordure rouge */
overflow:hidden; /* Permet de cacher ce qui dépasse */
}

.imgp {
background:grey; /* le bg de la div qui contient l'avatar */
position:absolute; /* Laissez comme ceci */
top:0;/* Laissez comme ceci */
left:0;/* Laissez comme ceci */
width:100%;/* Laissez comme ceci */
height:100%;/* Laissez comme ceci */
z-index:1;/* La position par rapport à l'autre div qui contient les infos */
-webkit-transition:all 0.5s;/* Laissez comme ceci */
-moz-transition:all 0.5s;/* Laissez comme ceci */
-o-transition:all 0.5s;/* Laissez comme ceci */
-ms-transition:all 0.5s;/* Laissez comme ceci */
transition:all 0.5s;/* Laissez comme ceci */
}

#englob:hover > .imgp {
margin-top:300px; /* Lorsque la souris passe sur la div #englob, on fait glisser l'image vers le bas de 200px */
}

.infosp {
background: #3c2723; /* le bg de la div qui contient les infos*/
position:absolute;/* Laissez comme ceci */
top:0;/* Laissez comme ceci */
left:0;/* Laissez comme ceci */
width:100%;/* Laissez comme ceci */
height:100%;/* Laissez comme ceci */
z-index:0;/* La position par rapport à l'autre div qui contient les infos (ici en dessous)*/
opacity:0;/* on met l'opacité à zero pour un effet stylé ;) */
margin-left:-200px;/* on décale la div de 200px, elle est invisible grâce a l'overflow:hidden de #englob */
-webkit-transition:all 0.5s;/* Laissez comme ceci */
-moz-transition:all 0.5s;/* Laissez comme ceci */
-o-transition:all 0.5s;/* Laissez comme ceci */
-ms-transition:all 0.5s;/* Laissez comme ceci */
transition:all 0.5s;/* Laissez comme ceci */
padding: 5px;
}

#englob:hover > .infosp {
opacity:1;/* Lorsque la souris passe sur la div #englob, on augmente l'opacité des infos */
margin-left:0px;/* et on décale cette div à 0px (position par défaut) */
}

/* MISE EN FORME DES LISTES DE SUJETS */

.bloc_sujets
{
width: 950px;
margin: auto;
background: #5f4441;
/*border: 1px solid #ececec;
box-shadow: 0px 0px 3px #868686;
-o-box-shadow: 0px 0px 3px #868686;
-moz-box-shadow: 0px 0px 3px #868686;
-webkit-box-shadow: 0px 0px 3px #868686;
-htm-box-shadow: 0px 0px 3px #868686;*/
padding: 5px;
}
.sujets
{
background: #b9a497;
border: 1px solid #74504c;
padding: 3px;
}
.topictitle
{
font-variant: small-caps;
font-size: 12px;
}
.sujets_auteur
{
display: block;
width: 200px;
font-size: 11px;
}
.sujet_last
{
display: block;
width: 180px;
height: 40px;
background: #d2c5bc;
border-left: 3px solid #391419;
border-right: 3px solid #391419;
padding-top: 10px;
font-size: 11px;
}
.sujets_stats
{
width: 900px;
text-align: right;
margin-bottom: 5px;
}
.sujets_stats_contenu
{
font-size: 10px;
color: #a4a4a4;
}
/* fin mise en forme liste sujet*/

/******************************
PAGE D'ACCUEIL
********************/

#conteneur{
position: relative;
width: 750px;
height: 500px;
padding: 10px;
}

.bienvenue{
font-size: 50px;
font-family: Times New Roman, Times, serif;
text-align: center;
color: #40161a;
}

.nav_pa{
background: #40161a;
padding: 4px;
text-align: center;
}

.nav_pa a{
text-decoration: none !important;
}

.menu_pa{
margin: 15px;
text-transform: uppercase;
color: white;
}

.menu_pa:hover{
background: #d61d1d;
-moz-transition-property: background;
-moz-transition-duration: 2s;
}

.pv{
text-align: center;
padding-top: 15px;
}

.pv a img{
text-align: center; border-radius: 100px;
opacity:0.5;
filter:alpha(opacity=50); /* For IE8 and earlier */
}

.pv a img:hover{
width: 100px;
height: 100px;
border-radius: 20px 20px 0px 0px;
opacity:1;
filter:alpha(opacity=100); /* For IE8 and earlier */
}

.titrepv{
text-transform: uppercase;
color: black;
position: absolute;
top: 150px;
left: -15px;
z-index: 13;
font-size: 15px;
transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
-khtml-transform: rotate(-90deg);
}

.contexte{
width: 350px;
height: 190px;
background: #40161a;
position: absolute;
top: 228px;
left: 25px;
}

.contexte_titre{
text-align: center;
font-size: georgia;
text-transform: uppercase;
color: white;
}

.texte{
text-align: justify;
overflow: auto;
height: 210px;
padding: 10px;
font-size: 12px;
color: #8f6666;
}

.top_site{
width: 350px;
height: 60px;
background: #40161a;
position: absolute;
left: 25px;
top: 425px;
color: white;
}

.partenaire{
width: 100px;
height: 258px;
background: #40161a;
position: absolute;
left: 390px;
top: 228px;
color: white;
}

.staff{
position: absolute;
right: 10px;
top: 228px;
}

.translate { /*effet transition présentation staff*/
height:50px;
width:256px;
background: #40161a;
color: black;
overflow: hidden;
position:relative;
color: #8f6666;
}

.translate p {
padding:5px;
margin:0px;
text-align:justify;
}

.translate img {
-moz-transition: all 1s ease-in-out;
-webkit-transition: all1s ease-in-out;
transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
-ms-transition: all 1s ease-in-out;
position:absolute;
top:0px;
left: 0px;
}

.translate:hover img {
-moz-transform: translate(256px, 68px);/*XX=largeur de ton image pour un déplacement horizontal; YY=hauteur de l'image pour déplacement vertical*/
-webkit-transform: translate(256px, 68px);
-o-transform: translate(256px, 68px);
-ms-transform: translate(256px, 68px);
transform: translate(256px, 68px);
}

.information{
width: 256px;
height: 70px;
background: #40161a;
position: absolute;
bottom: 35px;
right: 10px;
font-size: 12px;
color: #8f6666;
}

/***********************
QEEL
************************/
.mon_onglet{
display: inline;
padding: 5px;
font-size: 14px;
font-weight: bold;
margin: 2px;
color: #000;
text-shadow: 0px 1px 1px grey;
}

.tableauqueel{
border: 6px solid #441b21;
}

.mon_onglet:hover{
display: inline;
padding: 5px;
font-size: 14px;
font-weight: bold;
margin: 2px;
color: #000;
text-shadow: 0px 1px 2px grey;
}

.mon_onglet_selected{
display: inline;
padding: 5px;
position: relative;
top: 5px;
font-size: 14px;
font-weight: bold;
margin: 2px;
color: #000;
text-shadow: 0px 1px 2px grey;
}

.clear{
clear: both;}

.mon_contenu{
color: #000;
/*border: 1px solid #eccdcd;
box-shadow: 0px 2px 3px #a3a3a3;*/
background-color: #665356;
padding: 10px;
margin: 10 px;
width: 320px;
height: 150px;
line-height: normal;
font-size: 11px;}

.mon_contenu b{
color: white;
}

#mes_contenus, #mes_onglets{
height: 100%;
width:100%;}

a.personnagetitre {
font-family: arial;
font-size: 4;
text-transform : none;
text-decoration: none!important;
text-shadow: #000000 2px 2px 2px;
}

a.personnagetitre:hover {
font-family: arial;
font-size: 4;
text-transform : none!important;
text-decoration: none!important;
text-shadow: #000000 2px 2px 2px;
}

.rang {
padding: 3px;
border: 2px solid #a29c8b;
box-shadow: 0px 0px 2px #b2ab99;
border-radius: 5px;
background-color: #beb7a3;
margin-right: 3px;
margin-left: 3px;}

td.avatarfond {
background-color: #58012a42;
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
}

.partiedroite {
padding: 5px;
font-size: 12px;
text-align: justify;
font-family: calibri;
color: #7f5e63;
}

.descriptadmin {
border-left: 7px solid #477ab5;
font-family: calibri;
margin-left: 7px;
margin-top: 5px;
color: #8a7b58;
font-size: 10px;
padding: 3px;
}

.descriptjeu {
margin-left: 10px;
margin-right: 10px;
margin-top: 5px;
font-family: calibri;
color: #8a7b58;
font-size: 10px;
padding: 3px;
}

.descripi {
height: 66px;
overflow: auto;
position: relative;
right: 2px;
padding: 3px;
text-align: justify;
background-color: #d0c8b3;
border-top: 2px solid #c21f15;
}

.descripi:hover {
height: 66px;
overflow: auto;
position: relative;
right: 2px;
text-align: justify;
background-color: #d0c8b3;
padding: 3px;
border-top: 2px solid #477ab5;
}

.imagedescrp {
border: 2px solid #c21f15;
}

.imagedescrp:hover {
border: 2px solid #477ab5;
}

h4 {
color: #477ab5;
font-weight: bold;
font-size: 30px;
}

.partiedroiteqeel {
/*border: 1px solid #eccdcd;
box-shadow: 0px 2px 3px #a3a3a3;*/
background-color: #665356;
height: 92px;
margin: 3px;
padding: 4px;
font-size: 10px;
text-shadow: 0px 1px 1px gray;
overflow: auto;
}

.partiedessousqeel {
/*border: 1px solid #eccdcd;
box-shadow: 0px 2px 3px #a3a3a3;*/
background-color: #665356;
height: 80px;
margin: 3px;
padding: 4px;
font-size: 10px;
text-shadow: 0px 1px 1px gray;
overflow: auto;
}

/**************************************************************
-----------------------Ancienne partie CSS-------------------
**************************************************************/
/* fiche de présentation */

.presentationirl {
background-image:url(http://i40.servimg.com/u/f40/09/00/11/61/fond111.png);
width: 382px;
height: 94px;
border: 2px solid #f5f6f7;
box-shadow: 0px 1px 2px grey;
font-size: 11px;
padding: 3px;
font-family: arial;
line-height: 13px;
overflow: auto;
text-align: justify;
}

.titrepassehistoire {
font-size: 20px;
margin-top: 7px;
color: #9b8d74;
font-weight: bold;
font-family: batang;
text-shadow: 0px 1px 2px grey;
}

.passehistoire {
background-image:url(http://i40.servimg.com/u/f40/09/00/11/61/fond111.png);
width: 492px;
height: 400px;
padding: 3px;
border: 2px solid #f5f6f7;
box-shadow: 0px 1px 2px grey;
font-size: 11px;
font-family: arial;
line-height: 14px;
overflow: auto;
text-align: justify;
}

.questionnaire {
background-image:url(http://i40.servimg.com/u/f40/09/00/11/61/fond111.png);
width: 370px;
height: 192px;
border: 2px solid #f5f6f7;
box-shadow: 0px 1px 2px grey;
font-size: 11px;
font-family: arial;
line-height: 14px;
overflow: auto;
text-align: justify;
}

.ID2 {
width: 120px;
border: 2px solid #f5f6f7;
box-shadow: 0px 1px 2px grey;
}
.titrechamp {
font-weight: bold;
color: #8c6352;
}

.casepres {
background-image:url(http://i40.servimg.com/u/f40/09/00/11/61/fond111.png);
width: 191px;
height: 100px;
border: 2px solid #f5f6f7;
box-shadow: 0px 1px 2px grey;
font-size: 10px;
font-family: arial;
line-height: 12px;
overflow: auto;
text-align: justify;
}

.ID {
border: 2px solid #f5f6f7;
box-shadow: 0px 1px 2px grey;
}

.acteur {
position: relative;
right: 150px;
font-family: tahoma;
font-size: 10px;
}

.fonfiche {
background-image:url(http://i49.tinypic.com/4kjluo.png);
width: 530px;
height: 977px;
border-radius: 5px;
border: 1px solid #9b8d74;
box-shadow: 0px 2px 2px #897e6a;
}

.fonfiche:hover {
background-image:url(http://i49.tinypic.com/4kjluo.png);
width: 530px;
height: 977px;
border-radius: 5px;
border: 1px solid #b0a084;
box-shadow: 0px 2px 2px #d897e6a;
}

.champnom {
margin-top: 8px;
font-family: batang;
border-bottom: 3px double #aa6955;
color: #363636;
text-shadow: 0px 1px 1px #b8a98e;
font-size: 24px;
padding: 5px;
width: 80%;
}

#text_edit { display: block !important; }

.fondprofil2 {
border: 1px solid #9b8d74;
box-shadow: 0px 2px 3px #9b8d74;
background-image: url("http://i40.servimg.com/u/f40/09/00/11/61/sans_t19.png");
margin: 3px;
}

.pseudoprofil2 {
Text-Shadow: #b1a898 1px 0px 0px, #b1a898 1px 1px 0px, #b1a898 1px -1px 0px, #b1a898 -1px 1px 0px, #b1a898 -1px 0px 0px, #b1a898 -1px -1px 0px, #b1a898 0px 1px 0px, #b1a898 0px -1px 0px;
font-family: calibri;
font-size: 20px;
font-weight: bold;
margin: 5px;
line-height: 20px;
}
b{
color: #5f6069; /*couleur du texte*/
font-weight: bold;
font-size: 9px;
text-transform: uppercase;
font-variant: none; /*variante du texte (ici petites majuscules)*/
font-family: times new roman;
}

u{
border-bottom: 1px solid; /*--- taille du soulignement ---*/
border-color: #6e4338; /*--- couleur du soulignement ---*/
text-decoration: none;
}

i{
letter-spacing: 1px;
word-spacing: 2px;
text-decoration: none;
}

.rangcouleur {
align: center;
font-size: 10px;
letter-spacing: 3px;
}

.liensub {
background-color: #ece5d9;
border: 1px solid #867a64;
margin: 3px;
width: 100px;
height: 90px;
overflow: auto;
font-family: tahoma;
text-transform: capitalize;
text-align: center;
font-size: 14px;
color: black;
}

.liensub:hover {
background-color: #ece5d9;
border: 1px solid #867a64;
margin: 3px;
width: 100px;
height: 90px;
overflow: auto;
text-transform: capitalize;
font-family: tahoma;
text-align: center;
font-size: 14px;
}

.fichedeperso {
text-shadow: 0px 1px 1px gray;
padding: 5px;
text-align: justify;
font-size: 11px;
}

.descriptit {
padding: 5px;
height: 50px;
font-size: 12px;
overflow: auto;
}
a {
text-decoration:none!important;
text-transform:none;
}

a:hover{
text-background : url(http://img28.imageshack.us/img28/1880/gradiantwhite.png) repeat-x;
text-transform: none;
text-decoration: none!important;
}

a {font-variant: none;
family-font: times new roman;}

a.personnagetitre {
font-family: arial;
font-size: 4;
text-transform : none;
text-decoration: none!important;
text-shadow: #000000 2px 2px 2px;
}

a.personnagetitre:hover {
font-family: arial;
font-size: 4;
text-transform : none!important;
text-decoration: none!important;
text-shadow: #000000 2px 2px 2px;
}

.rang {
padding: 3px;
border: 2px solid #a29c8b;
box-shadow: 0px 0px 2px #b2ab99;
border-radius: 5px;
background-color: #beb7a3;
margin-right: 3px;
margin-left: 3px;}

td.avatarfond {
background-color: #58012a42;
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
}

/*CSS fiche présentation*/
.cadre1{
margin-left: 0px;
margin-right: 0px;
padding: 1px;
border-bottom: 0px #transp solid;
border-top: 0px #transp solid;
border-right: 5px #000000 solid;
border-left: 5px #000000 solid;
-moz-border-radius: 10px 10px 10px 10px;
background-color: #7D7D7D;
margin-left: 0px;
margin-right: 0px;
padding: 3px;
-moz-border-radius: 100px 100px 0px 0px;
}

.cadre2{
color: gray;
border-bottom: #000000 2px ;
letter-spacing: 2px;
word-spacing: 2px;
text-align: center;
font-size: 10px;
line-height: 13px;
line-width: 100px;
}

.cadre_int1{
width:400px;
BACKGROUND-COLOR:#ffffff;
border: 1px double #000000;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-transform: rotate(-2deg);
-moz-transform: rotate(-2deg);
padding: 20px;
}

.name_fiche{
font-family: Times New Roman;
font-style: italic;
font-weight: bold;
font-size: 40px;
letter-spacing: -3pt;
text-transform: lowercase;
text-shadow: 0px 0px 1px #FFFFFF;
}

.image{
-moz-transform:rotate(0deg);
-moz-box-shadow:0px 0px 10px black;
}

.titre_id{
font-family: Courier New;
font-size: 35px;
text-align: center;
color: #FFFFFF;
font-weight: bold;
}

.identification{
overflow: auto;
width:500px;
BACKGROUND-COLOR:#ffffff;
-moz-border-radius: 10px 10px 10px 10px;
border: 1px double #000000;
font-family: arial;
}

.cadre3{
margin-left: 0px;
margin-right: 0px;
padding: 4px;
border-bottom: 0px #transp solid;
border-top: 0px #transp solid;
border-right: 5px #000000 solid;
border-left: 5px #000000 solid;
-moz-border-radius: 10px 10px 10px 10px;
background-color: #7D7D7D;
margin-left: 0px;
margin-right: 0px;
padding: 3px;
-moz-border-radius: 0px 0px 0px 0px;
margin-top: -40px;
}

.cadre4{
margin-left: 0px;
margin-right: 0px;
padding: 4px;
border-bottom: 0px #transp solid;
border-top: 0px #transp solid;
border-right: 5px #000000 solid;
border-left: 5px #000000 solid;
-moz-border-radius: 10px 10px 10px 10px;
background-color: #7D7D7D;
margin-left: 0px;
margin-right: 0px;
padding: 3px;
-moz-border-radius: 0px 0px 100px 100px;
margin-top: -40px;
}

.image_1{
width: 100px;
-moz-transform:rotate(5deg);
margin-left:10px;
-moz-box-shadow:0px 0px 5px black;
}

.image_2{
width: 100px;
-moz-transform:rotate(-5deg);
margin-left:10px;
-moz-box-shadow:0px 0px 5px black;
}
/*fin CSS fiche présentation*/

Encore une fois, merci à vous ^^

Sujet: Re: Petit décalage de la bannière (A archiver) Ven 01 Mar 2013, 15:33

Bonsoir!

Je ne peut pas très bien voir votre problème car j'ai un petit écran :/
Mais est-ce que ceci dans votre CSS:

Code:: #i_logo {
margin-left: -3%;
}

Fonctionne? ^^

Sujet: Re: Petit décalage de la bannière (A archiver) Ven 01 Mar 2013, 15:36

Yep, ça marche nikel Very Happy

Merci !

Il me met juste par contre une barre de scroll en bas, mais c'est pas dérangeant

Merci à toi ^^

Sujet: Re: Petit décalage de la bannière (A archiver) Ven 01 Mar 2013, 18:34

Hello,

Si tu considères ton problème comme résolu, merci de penser à l'indiquer dans le titre de ton sujet Wink

Sujet: Re: Petit décalage de la bannière (A archiver) Ven 01 Mar 2013, 19:09

Alors c'est pas totalement résolu.

J'ai une barre de scroll en bas de page que je n'avais pas avant. Et je l'ai à cause du javascript.

Du coup, je me demande, s'il y a moyen de ne plus l'avoir, de régler ce petit problème ?

Sujet: Re: Petit décalage de la bannière (A archiver) Ven 01 Mar 2013, 19:26

XD Je croyais que ce n'était pas dérangeant ?

Sinon, je n'ai pas d'ascenseur en bas personnellement, probablement parce que j'ai une grande résolution d'écran ^^' Retirer cette marge artificielle serait un premier pas.

Peut-être que le décalage que tu avais était dû aux marges du body (je n'en suis pas sure cependant), essaie donc de faire ceci :

Code:: body {
margin:0;
}

Sujet: Re: Petit décalage de la bannière (A archiver) Ven 01 Mar 2013, 19:35

Visiblement ça dérange les membres en faite. Et vu qu'on a pas tous la même résolution d'écran, ceux qui en on un petit, ça les gènes ><

Du coup, j'ai tenté avec ce que tu m'as proposé, mais ça n'a aucun effet, c'est même pire.

En plus, j'ai l'annonce qui défile en haut qui c'est dit "youhou, rock'n'roll" je fais toute la taille de l'écran maintenant" xD

J'ai modif le forumline pour l'arranger, sauf qu'après c'est le profil qui pars en cacahuète.

Par contre maintenant, ça se passe sur le vrai fow Ici
Je supprimerai le lien au besoin quand (j'espère) nous parviendront à trouver une solution ^^

Sujet: Re: Petit décalage de la bannière (A archiver) Ven 01 Mar 2013, 19:48

J'ai besoin que tu me fasses une capture d'écran, je n'ai aucun problème de mon côté u_u'

Sur ton forum actuel, la marge est toujours là, donc impossible de voir en quoi "ça marche pas"/"c'est même pire". Et ma boule de cristal est en panne ce soir donc faudrait m'aider un peu.

Vu que tu affiches une bannière géante, j'imagine que tu sais qu'elle étire le forum, et donc son contenu ? En l’occurrence, le cas de l'annonce n'est pas un bug.

Sujet: Re: Petit décalage de la bannière (A archiver) Ven 01 Mar 2013, 19:56

Alors voici le screen
Petit décalage de la bannière (A archiver) Mini_756994screenbug

Pour la marge, si je ne l'ai pas, ça me fais remonter la barre de navig et la bannière part vers la gauche.

Sans utiliser le code pour les bann aléatoire, même si j'avais une bannière de fond, je n'avais pas de scrollbar en bas. Mais avec le code pour le changement aléatoire, ça fait tout capoter. J'ai la barre de scroll qui s'affiche en bas du coup.

Existe t'il un moyen de donner une taille à l'annonce ? Je l'avais fais via le forumline, mais ça déformé le profil après.

Sujet: Re: Petit décalage de la bannière (A archiver) Ven 01 Mar 2013, 20:22

Tu avais une bannière "de fond", à l'origine, non ? Maintenant, c'est une vraie image, qui n'est pas en fond, et donc prend de la place, naturellement. Du coup, il te faudrait utiliser un code qui n'utilise pas une image, mais met simplement à jour le fond de la page...

Pour l'histoire de la marge :
• Il faut (bien sûr) retirer celle que tu as mise pour le i_logo
• Retirer les marges latérales du body : as-tu pensé à essayer margin-left:0; margin-right:0;, vu qu'il y avait un problème avec la marge supérieure ?

Sujet: Re: Petit décalage de la bannière (A archiver) Sam 02 Mar 2013, 11:19

Re-coucou! x)

Alors pour vos annonces, essayez ceci dans votre CSS:

Code:: #fa_ticker_block { width: 60%; margin: 0 auto;}

Mais pour la barre de défilement, je ne sais pas de laquelle vous parlez. :S
À bientôt. ^^

Sujet: Re: Petit décalage de la bannière (A archiver) Sam 02 Mar 2013, 12:56

BB : Merci, le code a marché et fait retrouver une taille normal à l'annonce ^^
Pour la barre de défilement horizontal, tout dépend de la taille de ton écran.

'Christa : Du coup, je comprends pourquoi j'ai cette barre. En effet, c'est bien une bannière de fond. J'ai pas pensé que ça allait me la transformer en "image". J'ai donc recherché sur le forum et je suis tombé sur le tuto en question pour le background aléatoire (je mets le lien des fois que quelqu'un ait le même problème que moi et qu'il tombe sur mon sujet : http://www.css-actif.com/t7144-background-aleatoire?highlight=fond+aleatoire)

Le problème est donc résolu ^^

Merci beaucoup à vous deux de m'avoir aidé ^^

Le sujet peut être archivé ^^

Sujet: Re: Petit décalage de la bannière (A archiver) Sam 02 Mar 2013, 13:48

Je déplace donc, bonne soirée Nono. ^^

Petit décalage de la bannière (A archiver)

Petit décalage de la bannière (A archiver)

Sujets similaires

Sujets similaires

Partenaires Or