School of Progress

Partagez | 

[codage] décalage selon la taille des écrans

Error

avatar

Mes clubs


En savoir plus
Mes clubs extra-scolaires:
Voir le profil de l'utilisateur http://lessims4france.forum-officiel.fr/
Etudiante
Bons Points (BP) : 62

MessageSujet: [codage] décalage selon la taille des écrans   Mar 6 Juin - 18:44

Demande faite sur plusieurs forum, la plus vieille depuis le 2/05/17 et toujours pas de réponses

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Mozilla Firefox
Capture d'écran du problème :
Voir l'image:
 

Personnes concernées par le problème : Plusieurs utilisateurs
Problème apparu depuis : 02/05/2017
Lien du forum : http://ls4f-test.forumactif.com

Description du problème

Bonjour à vous ! je viens vous voir pour une petite question, et résolution de soucis.
Alors voila, j'ai en tête de re faire la déco de mon forum LS4F, et j'ai en tête de tout virer sur la droite.

j'y suis arrivée tout va bien : (ne pas tenir compte des couleurs du fond, c'est des marquage xD)
Spoiler:
 

Enfin ... tout va bien, sur mon écran qui fait 1600 x 900 ...
Si je passe sur plus grand, comme un 1920 x 1080 la c'est la cata ! (ne pas faire attentions il manque un bout de codage en plein milieu)
Spoiler:
 

le fond n'est plus aligné, le forum n'est plus collé à droite tout par en live ....

donc si vous avez une petite solution à ça ?
ça serais bête d'avoir un forum tout beau chez soit,mais tout de travers chez les autres :/


EDIT : suite à mon oublie je met mon CSS ici :
Code:
/* COULEURS LETTRES A/D/E/H/ETC */
.IIILTRS {
color:white !important; background:pink !important;
}
/* COULEURS LETTRES B/C/F/G/ETC */
.IINDIII {
background:lightblue !important;
}
/* COULEURS LISTES */
.IIILTRS div{
background:rgba(250,250,250,0.5) !important; color:black !important;
}
/* COULEURS CONSEIL BOTTIN */
.cdtABCIII {
background:lightblue !important;
}
.cdtABCIII a{
color:white !important;
}
/******************************************************************************************************************************************/
#bloc_ban
{
  position: relative;
  z-index: 10;
  width: 900px;
margin-left: 30.5%;
    margin-top:-1%;
  height: 500px;
  overflow: hidden;
  background: url(http://nsa38.casimages.com/img/2017/05/12/170512015213936005.png); /* banniere */
  border-bottom: 30px solid #1f1f1f; /* bordure sous banniere */
}
#render1
{
  position: absolute;
  width: 400px;
  height: 500px;
  background: url(http://nsa37.casimages.com/img/2017/05/12/170512015319550847.png); /* render de gauche */
  margin-left: -50px; /* decalage du render */
  transition: 1s;
}
#render2
{
  position: absolute;
  width: 400px;
  height: 500px;
  background: url(http://nsa38.casimages.com/img/2017/05/12/170512034806660070.png); /* render de droite */
  margin-left: 600px; /* decalage du render */
  transition: 1s;
}
#bloc_ban:hover #render1
{
  margin-left: -100px; /* decalage du render gauche au survol de banniere - pour pas de decalage mettre la meme marge que plus haut */
  transition: 1s;
}
#bloc_ban:hover #render2
{
  margin-left: 680px; /* decalage du render gauche au survol de banniere - pour pas de decalage mettre la meme marge que plus haut */
  transition: 1s;
}
#render1:hover
{
  margin-left: 0px !important; /* decalage du render gauche au survol de lui-meme - pour pas de decalage mettre la meme marge que plus haut */
  transition: 2s !important;
}
#render2:hover
{
  margin-left: 500px !important; /* decalage du render gauche au survol de lui-meme - pour pas de decalage mettre la meme marge que plus haut */
  transition: 2s !important;
}
/* toutes les marges des renders sont a adapter selon leur taille */
#render1_bloc, #render2_bloc
{
  position: absolute;
  width: 220px;
  height: 240px;
  background: #131311; /* couleur de fond du bloc apparaissant au survol des deux renders */
  border: 3px double #606736; /* bordures des cadres textes sur les renders */
  opacity: 0;
  transform: rotate(-20deg);
  margin-left: 80px;
  margin-top: 240px;
  transition-duration: 2s;
}
#render1:hover #render1_bloc, #render2:hover #render2_bloc
{
  opacity: 0.9;
  transform: rotate(0deg);
  transition-duration: 1s;
  transition-delay: 1s;
}
#titre_forum
{
  position: relative;
  z-index: 11;
  text-align: center;
  font-family: 'Six Caps', sans-serif;
  font-size: 28px;
  margin-top: -34px;
  color: #606736; /* couleur du titre du forum sous la banniere */
}
#sous_titre_forum
{
  text-align: center;
  font-family: 'PT Mono', ;
  font-size: 11px;
  letter-spacing: 10px; /* espacement des lettres du sous-titre */
  color: #444341; /* couleur du sous-titre du forum */
}
.ban_titre /* mise en forme des titres des cadres textes apparaissant sur les renders */
{
  text-align: center;
  font-family: 'Six Caps', sans-serif;
  color: #606736;
  font-size: 18px;
}
.ban_contenu /* mise en forme du contenu texte des cadres apparaissant sur les renders */
{
  width: 200px;
  margin: auto;
  height: 200px;
  overflow: auto;
  font-size: 10px;
  text-align: justify;
}

/********************************************************* NAVIGATION ****************************************************************/
#navSIT {
position:relative; top:-500%; margin-left:-139px; /* MODIFIABLE - DETERMINE LA POSITION */
line-height:2.6px;
}
.mainmenu img{
display:none;
}
/* LIEN NAVIGATION */
#navSIT a{
display:block; margin:4.6px 0;
width:135px; padding:14px 4px; border-radius:0px 0px/0px 0px;
text-transform:uppercase; text-align:center; font-size:14px; font-family:Arial; line-height:14px;
background:#212121; color:grey; /* MODIFIABLE */
transition:all .65s linear; -webkit-transition:all .65s linear;
}
/* SURVOL LIEN NAVIGATION */
#navSIT a:hover {
background:#576260; /* MODIFIABLE */
}
/* LIEN MENU RECHERCHE */
#search_menu a{
background:none !important; border:none !important; color:inherit !important;
}
/*****************************************************************************************************************************/
/*** import google fonts ***/
@import 'http://fonts.googleapis.com/css?family=Quicksand';

/*** import css de la scrollbar ***/
@import 'http://cdnjs.cloudflare.com/ajax/libs/jquery.perfect-scrollbar/0.6.12/css/perfect-scrollbar.min.css';

/*reset des styles par défault du navigateur*/
.template-linus-15 ul{ list-style:none; }
.template-linus-15 ul, .template-linus-15 h5, .template-linus-15 h4, .template-linus-15 h3, .template-linus-15 h2, .template-linus-15 h1, .template-linus-15 p, .template-linus-15 figure{margin:0;padding:0;font-weight:normal;}
.template-linus-15 a, .template-linus-15 a:hover{text-decoration:none;text-decoration:none!important;}
.template-linus-15 a img{border:none;}

/*style général*/
.template-linus-15{
   text-align:left;
   font-family:arial;
   font-size:11px;
   line-height:11px;
   z-index: 999;
  display:none;
}

/*police*/
.template-linus-15.tli-nav-menuH a[href="#nav-close"],
.template-linus-15.tli-nav-menuH .tli-nav-title,
.template-linus-15.tli-nav-menuH .tli-nav-subtitle {
  font-family: "Quicksand";
}

.template-linus-15.tli-nav-menuH hr{
  margin:8px 0;
  border:none;
  background:#1f1f1f;
  width:100%;
  height:1px;
}

.template-linus-15.tli-nav-menuH a{
  text-decoration:none;
  color:#e8e8e8;
}

.template-linus-15.tli-nav-menuH .tli-nav-texte a.tli-readmore{
  margin-top:5px;
  display:inline-block;
  text-transform:lowercase;
  background:#212121;
  color:#fff;
  padding:0 5px;
}

.template-linus-15.tli-nav-menuH {
  position: fixed;
  left: 0;
  top: 0;
  width: 200px;
  height: 100%;
  color:#e8e8e8;
  -webkit-transition: left ease 0.5s;
  transition: left ease 0.5s;
  overflow:none;
}

.template-linus-15.tli-nav-menuH:after {
  content:' ';
  background:#34423F;
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:1;
}

.template-linus-15.tli-nav-menuH.tli-nav-opacity:after {
  opacity:0.8;
}

.template-linus-15.tli-nav-menuH.tli-nav-menuRight{
  left:auto;
  right:0;
  -webkit-transition: right ease 0.5s;
  transition: right ease 0.5s;
}

.template-linus-15.tli-nav-menuH-closed {
  left:calc(-200px + 37.5px);
}

.template-linus-15.tli-nav-menuH-closed.tli-nav-menuRight {
  right:calc(-200px + 37.5px);
}

/*titres*/
.template-linus-15.tli-nav-menuH .tli-nav-title,
.template-linus-15.tli-nav-menuH .tli-nav-subtitle {
  color:#fff;
  text-transform:uppercase;
  margin: 0;
  padding: 7px 10px 5px 10px;
  font-weight: normal;
  line-height:15px;
}

.template-linus-15.tli-nav-menuH .tli-nav-title {
  background:#212121;
  border-left:5px solid #1e1e1e;;
  font-size: 14px;
}

.template-linus-15.tli-nav-menuH .tli-nav-subtitle {
  background:#1c1c1c;
  font-size: 11px;
  margin-top:5px;
}

.template-linus-15 .tli-nav-texte {
  position: relative;
  font-size: 11px;
  text-align: justify;
  padding: 15px 20px;
}

.template-linus-15 .tli-nav-empty iframe{
  display:block; 
}

/*crédits*/
.template-linus-15 .tli-nav-credits{
  background:#212121;
  font-size:11px;
  padding:5px;
}

.template-linus-15 .tli-nav-credits a{
  color:#e8e8e8;
  text-decoration:underline;
  text-decoration:underline !important;
}

.template-linus-15 .tli-nav-texte > div {
  max-height: 100px;
  overflow: hidden;
  font-size:0.93em !a;
  font-size:1em;
}

/*vignettes*/
.template-linus-15 .tli-nav-vignettes-triangle{
  margin:10px 0;
  position:relative;
}

.template-linus-15 .tli-nav-vignettes-triangle:not(.tli-nav-vignettes-triangle-pending){
  display:flex;
  flex-wrap:wrap;
}

.template-linus-15 .tli-nav-vignettes-triangle a {
  width: calc(100%/4);
  padding-top: calc(100%/4);
  display:block;
  position:relative;
}

.template-linus-15 .tli-nav-vignettes-triangle.tli-nav-vignettes-triangle-pending a{
  visibility:hidden;
  position:absolute;
  top:0;
}

.template-linus-15 .tli-nav-vignettes-carre {
  display:flex;
  flex-direction:row;
  flex-wrap:wrap; 
}

.template-linus-15 .tli-nav-vignettes-carre a:before {
  content:' ';
  display:block;
  padding-top:100%;
}

.template-linus-15 .tli-nav-vignettes-carre a {
  width: calc(100%/5);
  display:block;
  position:relative;
}

/*lien lire la suite*/
.template-linus-15.tli-nav-reverse .tli-nav-vignettes-carre a.tli-readmore:after {
  filter:invert(100%);
  -webkit-filter:invert(100%);
}

.template-linus-15 .tli-nav-vignettes-carre a.tli-readmore:after {
  content:' ';
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:no-repeat url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAA9klEQVRoQ+2WMQ4CIRBF/0yiN7Dawph4JA9hLGwstrI1XsHLWXoGK8bGwsQVBglsSD4tzMD8/wYQdD6k8/ODBcztIB2gA4UKEKFCAYvD6UBCwhWABYBHsdQ/ElR1QFWvZrY1sx0LoAN/MECEHKKxiWMiESEi5FCACBWKxFuoF4QGAJtct1V1b2aDmZ1zY98/2HsqzovQUUQuqWQT80sACuCZGysitxDCKRXnLSCVZ3KeD5lDNjrQyy3kMPN7CXvAIRt7gD3gwCS2hAgRISJUqEAifFTVdQjhUGubqk1c69CfeVlAC5VnewdaFEeEWqhMhOZWObb/C6BJyjE1zZzNAAAAAElFTkSuQmCC') 50%;
  background-size:90% 90%;
}

.template-linus-15 .tli-nav-vignettes-carre a.tli-readmore {
  position:relative;
  background:#000;
}

.template-linus-15 .tli-nav-vignettes-triangle a img,
.template-linus-15 .tli-nav-vignettes-carre a img{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}

.template-linus-15 .tli-nav-vignettes-triangle:after{
  content:' ';
  display:block;
  clear:both;
}

.template-linus-15 .tli-nav-vignettes-triangle canvas {
  margin:0 auto;
  display:block;
}

.template-linus-15 .tli-nav-desaturate.tli-nav-vignettes-triangle canvas:nth-child(1),
.template-linus-15 .tli-nav-desaturate.tli-nav-vignettes-triangle img {
  filter:saturate(0%);
  -webkit-filter:saturate(0%);
}

.template-linus-15 .tli-nav-vignettes-triangle canvas:nth-child(1) {
  position:relative;
  z-index:2;
}

.template-linus-15 .tli-nav-desaturate.tli-nav-vignettes-triangle canvas:nth-child(2) {
  position:absolute;
  top:0;
  left:0;
  right:0;
  z-index:1;
}

.template-linus-15.tli-nav-menuH > div{
  margin-top:35px;
  overflow:hidden;
  height:100%;
}

.template-linus-15.tli-nav-menuH > div:after{
  content:' ';
  display:block;
  width:100%;
  height:35px;
}

.template-linus-15.tli-nav-menuH > div,
.template-linus-15 .tli-nav-texte > div {
  z-index: 2;
  position: relative;
}

.template-linus-15.tli-nav-menuH a[href="#nav-close"] {
  display: block;
  width: 96%;
  padding:0 0 0 4%;
  height: 35px;
  line-height:35px;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 3;
  text-transform:uppercase;
  font-size:24px;
  background-position:100% 50%;
  background-repeat:no-repeat;
  background-color:#000;
  color:#FFF;
  text-align:left;
}

.template-linus-15.tli-nav-menuRight a[href="#nav-close"]{
  text-align:right;
  padding:0 4% 0 0;
}

.template-linus-15.tli-nav-menuH a[href="#nav-close"]:after{
  content:' ';
  position:absolute;
  height:100%;
  padding-left:20%;
  top:0;
  right:0;
  background-position:50%;
}

.template-linus-15.tli-nav-menuH.tli-nav-reverse a[href="#nav-close"]:after{
  filter:invert(100%);
  -webkit-filter:invert(100%);
}

.template-linus-15.tli-nav-menuRight a[href="#nav-close"]:after{
  right:auto;
  left:0;
}

.template-linus-15.tli-nav-menuRight.tli-nav-menuH-closed a[href="#nav-close"]:after,
.template-linus-15.tli-nav-menuH a[href="#nav-close"]:after {
  background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAA1klEQVRYR+2UMQoCMRBF3/aewZPYi2DrAaw9hF7A2kPYCWpr4RW8gGewslEGNrDIFjPJZxckqUPey8+fNIy8mpH5VIGawF8lMAWe0alSJTADrsAe2EUkFAIJPmnBS+DslSgV+IUfgA3wGUKgGG6SuQlI4LkCMniOgBQeFbA5fwCp7RfAGu8uXF8xox2wGd+2B72BFXDyNl4hYGdIJaIJpEvIJHIFZEmUCEgkSgX6JObAzVtMhUBX4g4sgNfQAsZbA8cIPPoReS8V2qd6ghC0u7kK1ARqAl/VkS4hIXBRSQAAAABJRU5ErkJggg==);
}

.template-linus-15.tli-nav-menuRight a[href="#nav-close"]:after,
.template-linus-15.tli-nav-menuH-closed a[href="#nav-close"]:after {
  background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAA2klEQVRYR+3TMWoCQRgF4M9UgVSeIF4h6dIpFl5C8ATWqXMZLyCkUcGjaOUVLFKEAYUUJuzMP2QRxmoL2fft438DPf8GPedrgNbA3TbwiHONBZU0MMcHpjhEEbmAGT7xgCPGUUQu4AlrTC5fHkbkAlJuVUQJoCqiFFANEQFUQUQBV8QGbz8OMz2fuky0BuAVWwwvgSss8PUfgFB4AkYaCIdHAFXCSwHVwksAL9iVHtyto8y9gRH2eEbWtf+2iFxAek9CLPHedWp/zbEE0GXenf/TAK2B1kDvDXwDaeUvId1wEZQAAAAASUVORK5CYII=);
}

/*scrollbar*/
.template-linus-15.tli-nav-menuH .ps-scrollbar-y-rail{
  opacity:0.2;
}
.template-linus-15.tli-nav-menuH .ps-container>.ps-scrollbar-y-rail:hover>.ps-scrollbar-y,
.template-linus-15 .ps-container>.ps-scrollbar-y-rail:active>.ps-scrollbar-y{
  width:6px;
}
.template-linus-15.tli-nav-menuH .ps-container>.ps-scrollbar-y-rail{
  width:10px;
}
.template-linus-15.tli-nav-menuH .ps-container:hover>.ps-scrollbar-y-rail:hover{
  background-color:transparent;
}

/*************************************************DEBUT Barre latérale*****************************************************/ 
    .reseaux_sociaux img {
        border: 1px solid #dadada;
        background: #cecece;
        padding: 5px;
    }
    .admin_humor {
        font-size: 10px;
    }
    #sidebar img[src="http://imgur.com/zidQbai.png"] {
        display: block;
    }
    #sidebar .title {
        font-family: Anton;
        display: block;
        font-size: 50px;
        margin-bottom: 10px;
        line-height: 50px;
    }
    #intrigue {
        background: #efefef;
        border: 1px solid #a0a0a0;
        padding: 10px;
        text-align: justify;
        font-size: 13px;
        height: 200px;
        overflow: auto;
        margin-bottom: 20px;
    }

    .membredumois {
        border: 3px solid #1d1d1d;
        margin: 15px 0px;
    }
    .infobulle {
        width: 50px;
        height: 50px;
        overflow: hidden;
        display: -webkit-inline-box;
        border: 2px solid #1d1d1d;
        position: relative;
    }
    #sidebar img[src="http://imgur.com/zUg2nVE.png"] {
        display: block;
        margin-bottom: 15px;
    }
    .infobulle img {
        height: 100%;
    }
    #rplibre {
        background: #c19bca;
        font-size: 12px;
        padding: 10px;
        color: white;
        margin-bottom: 15px;
    }
    #sidebar .carre {
        width: 60px;
        margin: 2px;
        border: 1px solid #5f5f5f;
    }
    #sidebar .bubulle {
        position: relative;
    }
    #sidebar .bubulle:hover div {
        transform: scale(1);
    }
    #sidebar .bubulle div {
        position: absolute;
        background: rgba(255, 255, 255, 0.7);
        width: 207px;
        top: 15px;
        left: 22px;
        right: 0;
        margin: 0;
        height: 106px;
        overflow: auto;
        font-size: 11px;
        text-align: justify;
        padding: 10px;
        line-height: 10px;
        transform: scale(0);
        transition: 0.5s all;
    }
    #lescreditslol {
        font-size: 11px;
    }
    .sidebar_all {
        background: #bbbbbb;
        height: 100% !important;
        position: fixed;
        top: 0;
        left: 0px;
        z-index: 0;
        width: 310px !important;
    }
/*************************************************FIN barre latérale*****************************************************/ 
/*************************************************Debut QEEL*****************************************************/ 
    /* QEEL */
    .QEEL {
    margin:auto; width:900px; height:330px;
    }
    /* TITRE QEEL */
    .tleQEEL a{
    position:absolute; width:395px; height:35px; padding-top:15px;
    text-align:center; text-transform:uppercase; font-size:18px; font-family:Arial;
    background:#18B316; color:#ffffff; /* MODIFIABLE */
    }
    /* 24H QEEL */
    .dayQEEL {
    position:absolute; margin-top:65px;
    width:190px; height:255px; padding:5px; overflow:auto;
    background:#b8b8b8; color:#000000; /* MODIFIABLE */
    }
    .dayQEEL .row1 {
    background:none; padding:0;
    }
    /* IMAGE QEEL */
    .imgQEEL {
    position:absolute; margin-top:65px; margin-left:215px;
    width:180px; height:150px;
    }
    /* STATISTIQUES QEEL */
    .stsQEEL {
    position:absolute; margin-left:410px;
    width:210px; height:110px; padding:10px; overflow:auto;
    background:#cecece; color:#000000; /* MODIFIABLE */
    font-size:14px; font-family:Arial; line-height:22px; text-align:justify;
    }
    /* ANNIVERSAIRES QEEL */
    .anvQEEL {
    position:absolute; margin-top:143px; margin-left:410px;
    width:208px; height:50px; padding:10px; overflow:auto;
    border:1px solid; text-align:justify;
    border-color:#18B316; /* MODIFIABLE */
    }
    .anvQEEL .row1{
    background:none !important; padding:0 !important;
    }
    .anvQEEL .gensmall {
    font-size:9px;
    color:#000000; /* MODIFIABLE */
    }
    /* NOMBRE UTILISATEURS EN LIGNE */
    #TLUS {
    display:block; margin:auto; margin-bottom:10px;
    letter-spacing:0; font-size:9px; text-align:center;
    color:#000000; /* MODIFIABLE */
    }
    /* MEMBRES CONNECTES QEEL */
    .onlineQEEL {
    position:absolute; margin-top:230px; margin-left:215px;
    width:415px; height:90px; padding:5px; overflow:auto;
    background:#18B316; color:#000000; /* MODIFIABLE */
    font-size:11px;
    }
    /* BLOC GROUPES QEEL */
    .blocGQEEL {
    position:absolute; margin-left:655px;
    width:245px; height:330px; overflow:auto;
    text-align:center; color:#b8b8b8; line-height:14px;
    background:#b8b8b8; /* MODIFIABLE */
    }
    /* GROUPE QEEL */
    .blocGQEEL a {
    display:block;
    padding:3px; margin-bottom:2px;
    font-size:16px; font-weight:bold; text-transform:uppercase;
    }
/*************************************************Fin QEEL*******************************************************/
/* PRESENTATION LISTE SUJETS */
/* BLOC LISTE SUJETS */
#LSBJ {
width:900px; margin:auto;
background:none; /* MODIFIABLE */
}
/* BLOC SUJET */
.SBJ {
width:900px; margin:15px auto 0; text-align:center;
}
/* OUTIL MODERATION */
.modSBJ {
position:absolute; z-index:3; margin-left:-15px; margin-top:55px;
}
/* BLOC ICÔNES / VUES & REPONSES LISTE SUJETS */
#ivrSBJ {
display:inline-block; vertical-align:top;
width:75px; height:90px;
}
.ivrSBJ {
position:relative;
width:75px; height:90px; overflow:hidden;
}
/* ICÔNES LISTE SUJETS */
.imgSBJ {
width:75px; height:90px;
}
/* VUES LISTE SUJETS */
.vuesSBJ {
position:absolute; z-index:2; margin-top:-200px;
width:75px; height:35px; padding-top:10px;
background:rgba(250,250,250,0.8); color:black; /* MODIFIABLE */
font-size:11px; text-align:center;
opacity:0; transition:all 0.45s ease; -webkit-transition:all 0.45s ease;
}
.ivrSBJ:hover .vuesSBJ {
margin-top:-90px; opacity:1;
}
/* REPONSES LISTE SUJETS */
.repSBJ {
position:absolute; z-index:2; margin-top:0px;
width:75px; height:35px; padding-top:10px;
background:rgba(250,250,250,0.6); color:black; /* MODIFIABLE */
font-size:11px; text-align:center;
opacity:0; transition:all 0.45s ease; -webkit-transition:all 0.45s ease;
}
.ivrSBJ:hover .repSBJ {
margin-top:-45px; opacity:1;
}
/* BLOC TITRE/DESCRIPTION/AUTEUR LISTE SUJETS */
.tleSBJ {
display:inline-block; vertical-align:top;
width:505px; height:75px; padding:15px 5px 0; overflow:hidden;
font-family:Arial; background:black; color:#C1BFB7; /* MODIFIABLE */
text-align:center; text-transform:uppercase; font-size:20px;
}
/* TITRE LISTE SUJETS */
.tleSBJ a {
color:#C1BFB7 !important; /* MODIFIABLE */
}
/* DESCRIPTION LISTE SUJETS */
.descSBJ {
font-size:16px; font-style:italic;
}
/* AUTEUR TITRE LISTE SUJETS */
.nameSBJ {
font-size:14px;
}
/* DERNIER MESSAGE LISTE SUJETS */
.lmsgSBJ {
display:inline-block;
width:300px; height:75px; padding:15px 0 0; overflow:hidden;
font-family:Arial; background:#242424; color:#C1BFB7; /* MODIFIABLE */
text-align:center; text-transform:uppercase;
}
/* AUTEUR DERNIER MESSAGE LISTE SUJETS */
.lmsgSBJ .gensmall {
font-size:20px;
}
/* LISTE DES PAGES */
.gotoSBJ {
width:870px; text-align:right; font-size:9px;
}
/*************************************************DEBUT sujet**********************************************/
/* PRESENTATION DU SUJET */
/* TITRE SUJET */
#tlePOST{
margin:5px auto; padding:15px 0; border-radius:0px;
background:rgba(255,255,255,0.7); color:black; font-family:Arial; /* MODIFIABLE */
text-transform:uppercase; text-align:center;
}
#tlePOST h1 {
display:block; font-size:32px;
}
/* BLOC PSEUDONYME */
.namePOST {
margin:5px auto 0; padding:15px 0; text-align:left; border-radius:0px 0px 0 0;
background:black; font-family:Arial;  /* MODIFIABLE */
font-size:42px; text-transform:uppercase;
}
/* ICÔNE EN LIGNE */
.onPOST {
display:inline-block; vertical-align:middle; margin-left:10px;
}
/* TRAIT TEXTE RANG */
.rankPOST::before {
content:''; display:inline-block; vertical-align:middle; margin-right:5px;
width:50px; height:1px;
background:white; /* MODIFIABLE */
}
/* TEXTE RANG */
.rankPOST {
display:inline-block; vertical-align:middle;
text-transform:uppercase; font-size:11px; opacity:0.8;
color:white; /* MODIFIABLE */
}
/* BLOC AVATAR & INFORMATIONS JOUEUR */
.boxPOST {
padding:10px;
background:#F2F2F2; /* MODIFIABLE */
}
/* BLOC INFORMATIONS JOUEUR */
.abtPOST {
margin:10px auto 5px;
width:100%; text-align:left;
}
/* INFORMATION JOUEUR */
.abtPOST div{
margin-bottom:5px;
padding:5px; border:1px solid;
text-transform:uppercase; font-size:10px;
border-color:lightgrey; background:white; /* MODIFIABLE */
}
/* INTITULES INFORMATIONS JOUEUR */
.abtPOST span{
font-weight:bold; /* MODIFIABLE */
}
/* REDIMENSIONNEMENT IMAGES INFORMATIONS JOUEUR */
.abtPOST div img {
margin:auto; max-width:95%;
}
/* IMAGE RANG */
.imgrankPOST img {
margin:auto; max-width:100%;
}
/* BLOC MESSAGE */
.msgPOST {
background:white; /* MODIFIABLE */
}
/* BLOC DATE MESSAGE / OUTILS MODERATION */
.tktPOST {
margin:5px auto; width:90%; padding:5px; text-align:right;
}
/* DATE MESSAGE */
.datePOST {
display:inline-block; vertical-align:middle;
font-size:12px; text-transform:uppercase; color:black; /* MODIFIABLE */
}
/* CITER / EDITER / SUPPRIMER / IP */
.toolsPOST {
display:inline-block; vertical-align:middle; margin-left:15px;
}
/* APPARENCE MESSAGE */
div.postbody {
padding:15px; text-align:justify;
color:black; /* MODIFIABLE */
}
/* IMAGES CONTACT JOUEUR */
.ktactPOST {
padding:5px 0; text-align:center; border-radius:0 0 0px 0px;
background:grey; /* MODIFIABLE - MESSAGES DES INVITES */
}
/*************************************************FIN sujet**********************************************/
/*************************************************Debut PA**********************************************/
    /* PA */
    /* BLOC LIENS */
    .lksSHAM {
    background:#89CEEA !important;
    }
    /* LIEN BLOC LIENS */
    .lksSHAM a{
    color:#ffffff !important;
    }
    /* SURVOL LIEN BLOC LIENS */
    .lksSHAM a:hover {
    color:#000000 !important;
    }
    /* CONTEXTE */
    .ctxtSHAM {
    background:#b8b8b8 !important; color:#ffffff !important;
    }
    /* BLOC STAFF */
    .staffSHAM{
    background:#18B316 !important;
    }
    /* CONTENU STAFF */
    .staffSHAM ul li {
    color:#ffffff !important;
    }
    /* BULLE STAFF */
    .staffSHAM .bullSHAM label {
    background:#ffffff !important;
    }
    /* SURVOL BULLE STAFF */
    .staffSHAM .bullSHAM label:after {
    background:#89CEEA !important;
    }
    /* PREDEFINIS MASCULINS */
    .HSHAM {
    background-image:url(http://nsa37.casimages.com/img/2016/08/14/160814082653293945.png) !important; border-color:#cecece !important; color:#cecece !important;
    }
    /* PREDEFINIS FEMININS */
    .FSHAM {
    background-image:url(http://nsa38.casimages.com/img/2016/08/14/160814082653380252.png) !important; border-color:#cecece !important; color:#cecece !important;
    }
    /* BLOC NOUVELLES */
    .newsSHAM {
    background:#18B316 !important; color:#ffffff !important;
    }
    /* CONTENU NOUVELLES */
    .newsSHAM div {
    background:#18B316 !important; color:#fffff !important;
    }
    /* EVENEMENT EN COURS */
    .eventSHAM p{
    background:#b8b8b8!important; color:#ffffff !important;
    }
    /* MEMBRE DU MOIS */
    .mdmSHAM p{
    background:#cecece !important; color:#ffffff !important; 
    }
    /* LIENS MEMBRE DU MOIS */
    .mdmSHAM a{
    color:#000000 !important; 
    }
    /* TOP-SITES */
    .topSHAM {
    background:#89CEEA !important; color:#ffffff !important;
    }
/*************************************************Fin PA**********************************************/
/* BLOC TITRE CATEGORIE */
.tleCAT{
margin:5px auto 15px; width:900px; padding:20px 0; text-align:center;
background:none;
}
/* TITRE CATEGORIE */
.tleCAT h2{
margin:0;
font-size:32px; text-transform:uppercase; letter-spacing:3px;
color:white; font-family:Arial; /* MODIFIABLE */
}
/* BLOC FORUM */
.FRM {
margin:auto; margin-bottom:10px;
width:800px; height:250px; text-align:center;
}
/* BLOCS POSITIONNEMENT */
.boxFRM {
display:inline-block; vertical-align:top;
}
.boxFRMII {
display:inline-block; vertical-align:top; margin:0 15px;
width:230px;
}
/* BLOC TITRE FORUM */
.tleFRM {
width:395px; height:35px; padding-top:15px;
text-align:center; text-transform:uppercase; font-size:18px; font-family:Arial;
background:grey; /* MODIFIABLE */
}
/* TITRE FORUM */
.tleFRM a{
color:black !important;  /* MODIFIABLE */
}
/* DESCRIPTION FORUM */
.descFRM {
display:inline-block; vertical-align:top; margin-top:15px; margin-right:15px;
width:190px; height:170px; padding:5px; overflow:auto;
background:white; color:black; /* MODIFIABLE */
font-size:11px; text-align:justify;
}
/* IMAGE DESCRIPTIVE */
.descFRM img {
position:absolute; z-index:3; margin-left:405px; margin-top:-70px;
width:230px; height:100px;
transition:all 0.55s; -webkit-transition:all 0.55s;
}
.descFRM img:hover {
opacity:0;
}
/* AVATAR DERNIER POSTEUR FORUM */
#avaFRM {
display:inline-block; vertical-align:top; margin-top:15px;
width:180px; height:140px; overflow:hidden;
background:#dedede; /* MODIFIABLE */
}
#avaFRM img {
width:180px; filter:grayscale(1); -webkit-filter:grayscale(1);
}
/* ICÔNES FORUM */
.imgFRM {
margin-bottom:15px;
width:230px; height:100px;
}
/* NOMBRE SUJETS FORUM */
.nbFRM {
display:inline-block; vertical-align:top;
width:110px; height:65px; padding-top:25px;
font-size:24px; text-transform:uppercase; text-align:center;
background:black; color:white; /* MODIFIABLE */
}
/* NOMBRE MESSAGES FORUM */
.nbFRMII {
display:inline-block; vertical-align:top; margin-left:10px;
width:110px; height:65px; padding-top:25px;
font-size:24px; text-transform:uppercase; text-align:center;
background:#64B3AC; color:white; /* MODIFIABLE */
}
/* DERNIER MESSAGE FORUM */
.lmsgFRM {
position:absolute; margin-top:-25px; margin-left:215px;
width:415px; height:15px; padding:5px; overflow:auto;
background:white; color:black; /* MODIFIABLE */
font-size:11px; text-align:center; text-transform:uppercase;
}
/* BLOC SOUS-FORUMS */
.sfFRM {
display:inline-block; vertical-align:top;
width:135px; height:240px; padding:5px 5px 0; overflow:auto;
background:grey; /* MODIFIABLE */
text-align:center; line-height:0px; color:rgba(0,0,0,0);
}
/* LIEN SOUS-FORUM */
.sfFRM a{
display:block; margin-bottom:5px; padding:5px;
text-transform:uppercase; text-align:center; font-size:10px; line-height:14px;
background:white; color:grey; /* MODIFIABLE */
}
/* FOND TITRE CATEGORIE 1 */
div#cat1 {
background-color:red;
}
/* FOND TITRE CATEGORIE 2 */
div#cat2 {
background-color:blue;
}
/* FOND TITRE CATEGORIE 3 */
div#cat3 {
  background-color:green;}
/**********************************************************************************************************************/
body {
background-image: url(http://nsa38.casimages.com/img/2017/05/02/170502033504559698.png), url(http://nsa37.casimages.com/img/2017/05/02/170502080840442399.png);
background-position: top center, top right;
background-repeat: no-repeat, no-repeat;
background-attachment: scroll, fixed;
background-color:#cecece;
}
/***************************************************************************************************************************/
    .secondarytitle, .secondarytitle ~ th {
    background: none !important;
    }
    /* catégorie 1 */
    tr#cat1 {
    background-color: red;
    }
    /* catégorie 2 */
    tr#cat2 {
    background-color: pink;
    }
/*****************************************************************************************************************/
.bodyline{
position:absolute; right:200px; top:0;
width:900px;
}
/*******************************************/

pour les templates, demandez moi (j'ai pas envie de surcharger la page)

et la réponse :
Citation :
vous voulez une largeur adaptable et vous devrez convertir toutes les valeurs absolues (px) en valeurs relatives (%)

et sur un autre forum :
Citation :
Bonjour,

Pourquoi me faudrait-il assumer votre incompétence au prétexte de votre appréciation d'un service dont il est clairement spécifié qu'il ne s'inscrit dans une optique d'entraide ? Il n'est de ma responsabilité de contenter votre avidité ni de restaurer un projet ébréché d'ambitions chimériques.

Ceci clarifié, s'agissant présentement d'un positionnement disposant de largeurs fixes et non d'une adaptation des proportions du forum, vous devez au contraire appliquer des valeurs absolues. Par ailleurs, vous centrez votre image de fond alors que vous devriez l'aligner à droite.

Remplacez :
Code:
    body
            {
            background-image: url(http://nsa38.casimages.com/img/2017/05/02/170502033504559698.png), url(http://nsa37.casimages.com/img/2017/05/02/170502080840442399.png);
            background-position: top center, top center;
            background-repeat: no-repeat, no-repeat;
            background-attachment: scroll, fixed;
            background-color:#cecece;
           
            }


Par :
Code:
    body {
    background-image: url(http://nsa38.casimages.com/img/2017/05/02/170502033504559698.png), url(http://nsa37.casimages.com/img/2017/05/02/170502080840442399.png);
    background-position: top center, top right;
    background-repeat: no-repeat, no-repeat;
    background-attachment: scroll, fixed;
    background-color:#cecece;
    }


Remplacez :

Code:
    .bodylinewidth{
        margin-left: 29.6%;
      margin-top:0;
        }


Par :
Code:
    .bodyline{
    position:absolute; right:200px; top:0;
    width:900px;
    }


Merci d'adresser tout questionnement supplémentaire à un forum d'entraide.


Dernière édition par Error le Mar 6 Juin - 21:49, édité 1 fois


Revenir en haut Aller en bas

Elilith

avatar

Mes clubs


En savoir plus
Mes clubs extra-scolaires:
Voir le profil de l'utilisateur
Inspectrice
Bons Points (BP) : 2773

MessageSujet: Re: [codage] décalage selon la taille des écrans   Mar 6 Juin - 19:51

Coucou !

Je suis loin d'être une grande pro en codage, mais je pense que quelle que soit la personne qui cherchera une solution, il lui faudra tout d'abord tes codes concernés (templates et feuille de style) :3 !

Voilà voilà, déjà avec ça, n'est crainte, tu obtiendras l'aide que tu attends depuis si longtemps x') !

Bonne journée à toi ;foouu !



Spoiler:
 
Revenir en haut Aller en bas

Error

avatar

Mes clubs


En savoir plus
Mes clubs extra-scolaires:
Voir le profil de l'utilisateur http://lessims4france.forum-officiel.fr/
Etudiante
Bons Points (BP) : 62

MessageSujet: Re: [codage] décalage selon la taille des écrans   Mar 6 Juin - 21:46

#conne ... J'ai totalement oubliée de mettre les CSS ... pardon, je désespère tellement que je fais les choses à moitié ... J'edit mon premier poste et je rajoute la chose
et je rajoute aussi une réponse que j'ai eu mais qui ne m'a ABSOLUMENT pas aidé x)


Revenir en haut Aller en bas

MadSushi

avatar

Mes clubs

Voir le profil de l'utilisateur http://mugen-seiki.forumactif.com/
Bons Points (BP) : 90

MessageSujet: Re: [codage] décalage selon la taille des écrans   Mar 6 Juin - 22:55

Coucou Smile
Je ne suis pas spécialiste en codage, mais j'ai déjà eu des soucis de ce genre, je crois que le problème vient des : margin-top et margin-left. J'ai réglé le problème en changeant le codage Razz
Des spécialistes de SOP vont t'aider Wink

Bonne chance Smile


Revenir en haut Aller en bas

Error

avatar

Mes clubs


En savoir plus
Mes clubs extra-scolaires:
Voir le profil de l'utilisateur http://lessims4france.forum-officiel.fr/
Etudiante
Bons Points (BP) : 62

MessageSujet: Re: [codage] décalage selon la taille des écrans   Mar 6 Juin - 23:04

merci MadSushi ^^
j'ai hâte d'avoir de l'aide, car je pleur mentalement la xD


Revenir en haut Aller en bas

Miettes

avatar

Mes clubs


En savoir plus
Mes clubs extra-scolaires:
Voir le profil de l'utilisateur
Intervenante
Bons Points (BP) : 212

MessageSujet: Re: [codage] décalage selon la taille des écrans   Mer 7 Juin - 9:38

Coucou Smile

Lucky girl ! au boulot mon écran a la résolution qui fait péter ton forum (idéal pour pouvoir t'aider =) )

*** va se plonger dans le code ***

Pour commencer, tu as mis ceci dans ta CSS :
Code:
.bodyline {
    position: absolute;
    right: 194px;
    top: 80;
    width: 900px;
}

Tu places de manière arbitraire (avec le position absolute) une seule cellule de ton tableau. Or, pour que ça soit plus propre, c'est tout le tableau qu'on va placer comme il faut. Du coup, on supprime cette CSS et on va plutôt appliquer le positionnement sur "bodylinewidth". Tiens au passage : ce tableau fait 800px de large alors que tu as une cellule à l'intérieur qui en fait 900 (problème non ? Smile )

Code:
.bodylinewidth {
    position: absolute;
    right: 328px;
    top: 80px;
}

Le "right: 328px" c'est pour ta colonne de droite Smile

Et, comme à chaque fois qu'on utilise un position "absolute", on va définir une référence en mettant un "position:relative" sur le body
Code:
body {
background-image: url(http://nsa38.casimages.com/img/2017/05/02/170502033504559698.png), url(http://nsa37.casimages.com/img/2017/05/02/170502080840442399.png);
background-position: top center, top right;
background-repeat: no-repeat, no-repeat;
background-attachment: scroll, fixed;
background-color:#cecece;
position: relative;
}

Ensuite, il faut placer comme il faut la bannière ; pour ça, on va changer la CSS suivante :
Code:
#bloc_ban {
    position: relative;
    z-index: 10;
    width: 900px;
    margin-left: 30.5%;
    margin-top: -1%;
    height: 500px;
    overflow: hidden;
    background: url(http://nsa38.casimages.com/img/2017/05/12/170512015213936005.png);
    border-bottom: 30px solid #1f1f1f;
}

Déjà, on oublie les marging-top négatives ^^ Ton bloc est en position "relative", tu peux juste lui mettre un "top: -1%", ça sera plus propre ^^ Cela dit, pour que ça soit plus simple, on va plutot utiliser une position absolute aussi ici Smile

Code:
#bloc_ban {
    position: absolute;
    z-index: 10;
    width: 908px;
    right: 192px;
    top: -8px;
    height: 500px;
    overflow: hidden;
    background: url(http://nsa38.casimages.com/img/2017/05/12/170512015213936005.png);
    border-bottom: 30px solid #1f1f1f;
 }

Ensuite, la nav' Smile Eh bien ici aussi, on va utiliser du positionnement absolute ^^
Code:
#navSIT {
    position: absolute;
    line-height: 2.6px;
    right: 900px;
}

Voilà déjà la CSS modifiée avec tout ça :
Code:
/* COULEURS LETTRES A/D/E/H/ETC */
.IIILTRS {
color:white !important; background:pink !important;
}
/* COULEURS LETTRES B/C/F/G/ETC */
.IINDIII {
background:lightblue !important;
}
/* COULEURS LISTES */
.IIILTRS div{
background:rgba(250,250,250,0.5) !important; color:black !important;
}
/* COULEURS CONSEIL BOTTIN */
.cdtABCIII {
background:lightblue !important;
}
.cdtABCIII a{
color:white !important;
}
/******************************************************************************************************************************************/
#bloc_ban {
    position: absolute;
    z-index: 10;
    width: 908px;
    right: 192px;
    top: -8px;
    height: 500px;
    overflow: hidden;
    background: url(http://nsa38.casimages.com/img/2017/05/12/170512015213936005.png);
    border-bottom: 30px solid #1f1f1f;
 }
#render1
{
  position: absolute;
  width: 400px;
  height: 500px;
  background: url(http://nsa37.casimages.com/img/2017/05/12/170512015319550847.png); /* render de gauche */
  margin-left: -50px; /* decalage du render */
  transition: 1s;
}
#render2
{
  position: absolute;
  width: 400px;
  height: 500px;
  background: url(http://nsa38.casimages.com/img/2017/05/12/170512034806660070.png); /* render de droite */
  margin-left: 600px; /* decalage du render */
  transition: 1s;
}
#bloc_ban:hover #render1
{
  margin-left: -100px; /* decalage du render gauche au survol de banniere - pour pas de decalage mettre la meme marge que plus haut */
  transition: 1s;
}
#bloc_ban:hover #render2
{
  margin-left: 680px; /* decalage du render gauche au survol de banniere - pour pas de decalage mettre la meme marge que plus haut */
  transition: 1s;
}
#render1:hover
{
  margin-left: 0px !important; /* decalage du render gauche au survol de lui-meme - pour pas de decalage mettre la meme marge que plus haut */
  transition: 2s !important;
}
#render2:hover
{
  margin-left: 500px !important; /* decalage du render gauche au survol de lui-meme - pour pas de decalage mettre la meme marge que plus haut */
  transition: 2s !important;
}
/* toutes les marges des renders sont a adapter selon leur taille */
#render1_bloc, #render2_bloc
{
  position: absolute;
  width: 220px;
  height: 240px;
  background: #131311; /* couleur de fond du bloc apparaissant au survol des deux renders */
  border: 3px double #606736; /* bordures des cadres textes sur les renders */
  opacity: 0;
  transform: rotate(-20deg);
  margin-left: 80px;
  margin-top: 240px;
  transition-duration: 2s;
}
#render1:hover #render1_bloc, #render2:hover #render2_bloc
{
  opacity: 0.9;
  transform: rotate(0deg);
  transition-duration: 1s;
  transition-delay: 1s;
}
#titre_forum
{
  position: relative;
  z-index: 11;
  text-align: center;
  font-family: 'Six Caps', sans-serif;
  font-size: 28px;
  margin-top: -34px;
  color: #606736; /* couleur du titre du forum sous la banniere */
}
#sous_titre_forum
{
  text-align: center;
  font-family: 'PT Mono', ;
  font-size: 11px;
  letter-spacing: 10px; /* espacement des lettres du sous-titre */
  color: #444341; /* couleur du sous-titre du forum */
}
.ban_titre /* mise en forme des titres des cadres textes apparaissant sur les renders */
{
  text-align: center;
  font-family: 'Six Caps', sans-serif;
  color: #606736;
  font-size: 18px;
}
.ban_contenu /* mise en forme du contenu texte des cadres apparaissant sur les renders */
{
  width: 200px;
  margin: auto;
  height: 200px;
  overflow: auto;
  font-size: 10px;
  text-align: justify;
}

/********************************************************* NAVIGATION ****************************************************************/
#navSIT {
    position: absolute;
    line-height: 2.6px;
    right: 900px;
}
.mainmenu img{
display:none;
}
/* LIEN NAVIGATION */
#navSIT a{
display:block; margin:4.6px 0;
width:135px; padding:14px 4px; border-radius:0px 0px/0px 0px;
text-transform:uppercase; text-align:center; font-size:14px; font-family:Arial; line-height:14px;
background:#212121; color:grey; /* MODIFIABLE */
transition:all .65s linear; -webkit-transition:all .65s linear;
}
/* SURVOL LIEN NAVIGATION */
#navSIT a:hover {
background:#576260; /* MODIFIABLE */
}
/* LIEN MENU RECHERCHE */
#search_menu a{
background:none !important; border:none !important; color:inherit !important;
}
/*****************************************************************************************************************************/
/*** import google fonts ***/
@import 'http://fonts.googleapis.com/css?family=Quicksand';

/*** import css de la scrollbar ***/
@import 'http://cdnjs.cloudflare.com/ajax/libs/jquery.perfect-scrollbar/0.6.12/css/perfect-scrollbar.min.css';

/*reset des styles par défault du navigateur*/
.template-linus-15 ul{ list-style:none; }
.template-linus-15 ul, .template-linus-15 h5, .template-linus-15 h4, .template-linus-15 h3, .template-linus-15 h2, .template-linus-15 h1, .template-linus-15 p, .template-linus-15 figure{margin:0;padding:0;font-weight:normal;}
.template-linus-15 a, .template-linus-15 a:hover{text-decoration:none;text-decoration:none!important;}
.template-linus-15 a img{border:none;}

/*style général*/
.template-linus-15{
  text-align:left;
  font-family:arial;
  font-size:11px;
  line-height:11px;
  z-index: 999;
  display:none;
}

/*police*/
.template-linus-15.tli-nav-menuH a[href="#nav-close"],
.template-linus-15.tli-nav-menuH .tli-nav-title,
.template-linus-15.tli-nav-menuH .tli-nav-subtitle {
  font-family: "Quicksand";
}

.template-linus-15.tli-nav-menuH hr{
  margin:8px 0;
  border:none;
  background:#1f1f1f;
  width:100%;
  height:1px;
}

.template-linus-15.tli-nav-menuH a{
  text-decoration:none;
  color:#e8e8e8;
}

.template-linus-15.tli-nav-menuH .tli-nav-texte a.tli-readmore{
  margin-top:5px;
  display:inline-block;
  text-transform:lowercase;
  background:#212121;
  color:#fff;
  padding:0 5px;
}

.template-linus-15.tli-nav-menuH {
  position: fixed;
  left: 0;
  top: 0;
  width: 200px;
  height: 100%;
  color:#e8e8e8;
  -webkit-transition: left ease 0.5s;
  transition: left ease 0.5s;
  overflow:none;
}

.template-linus-15.tli-nav-menuH:after {
  content:' ';
  background:#34423F;
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:1;
}

.template-linus-15.tli-nav-menuH.tli-nav-opacity:after {
  opacity:0.8;
}

.template-linus-15.tli-nav-menuH.tli-nav-menuRight{
  left:auto;
  right:0;
  -webkit-transition: right ease 0.5s;
  transition: right ease 0.5s;
}

.template-linus-15.tli-nav-menuH-closed {
  left:calc(-200px + 37.5px);
}

.template-linus-15.tli-nav-menuH-closed.tli-nav-menuRight {
  right:calc(-200px + 37.5px);
}

/*titres*/
.template-linus-15.tli-nav-menuH .tli-nav-title,
.template-linus-15.tli-nav-menuH .tli-nav-subtitle {
  color:#fff;
  text-transform:uppercase;
  margin: 0;
  padding: 7px 10px 5px 10px;
  font-weight: normal;
  line-height:15px;
}

.template-linus-15.tli-nav-menuH .tli-nav-title {
  background:#212121;
  border-left:5px solid #1e1e1e;;
  font-size: 14px;
}

.template-linus-15.tli-nav-menuH .tli-nav-subtitle {
  background:#1c1c1c;
  font-size: 11px;
  margin-top:5px;
}

.template-linus-15 .tli-nav-texte {
  position: relative;
  font-size: 11px;
  text-align: justify;
  padding: 15px 20px;
}

.template-linus-15 .tli-nav-empty iframe{
  display:block; 
}

/*crédits*/
.template-linus-15 .tli-nav-credits{
  background:#212121;
  font-size:11px;
  padding:5px;
}

.template-linus-15 .tli-nav-credits a{
  color:#e8e8e8;
  text-decoration:underline;
  text-decoration:underline !important;
}

.template-linus-15 .tli-nav-texte > div {
  max-height: 100px;
  overflow: hidden;
  font-size:0.93em !a;
  font-size:1em;
}

/*vignettes*/
.template-linus-15 .tli-nav-vignettes-triangle{
  margin:10px 0;
  position:relative;
}

.template-linus-15 .tli-nav-vignettes-triangle:not(.tli-nav-vignettes-triangle-pending){
  display:flex;
  flex-wrap:wrap;
}

.template-linus-15 .tli-nav-vignettes-triangle a {
  width: calc(100%/4);
  padding-top: calc(100%/4);
  display:block;
  position:relative;
}

.template-linus-15 .tli-nav-vignettes-triangle.tli-nav-vignettes-triangle-pending a{
  visibility:hidden;
  position:absolute;
  top:0;
}

.template-linus-15 .tli-nav-vignettes-carre {
  display:flex;
  flex-direction:row;
  flex-wrap:wrap; 
}

.template-linus-15 .tli-nav-vignettes-carre a:before {
  content:' ';
  display:block;
  padding-top:100%;
}

.template-linus-15 .tli-nav-vignettes-carre a {
  width: calc(100%/5);
  display:block;
  position:relative;
}

/*lien lire la suite*/
.template-linus-15.tli-nav-reverse .tli-nav-vignettes-carre a.tli-readmore:after {
  filter:invert(100%);
  -webkit-filter:invert(100%);
}

.template-linus-15 .tli-nav-vignettes-carre a.tli-readmore:after {
  content:' ';
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:no-repeat url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAA9klEQVRoQ+2WMQ4CIRBF/0yiN7Dawph4JA9hLGwstrI1XsHLWXoGK8bGwsQVBglsSD4tzMD8/wYQdD6k8/ODBcztIB2gA4UKEKFCAYvD6UBCwhWABYBHsdQ/ElR1QFWvZrY1sx0LoAN/MECEHKKxiWMiESEi5FCACBWKxFuoF4QGAJtct1V1b2aDmZ1zY98/2HsqzovQUUQuqWQT80sACuCZGysitxDCKRXnLSCVZ3KeD5lDNjrQyy3kMPN7CXvAIRt7gD3gwCS2hAgRISJUqEAifFTVdQjhUGubqk1c69CfeVlAC5VnewdaFEeEWqhMhOZWObb/C6BJyjE1zZzNAAAAAElFTkSuQmCC') 50%;
  background-size:90% 90%;
}

.template-linus-15 .tli-nav-vignettes-carre a.tli-readmore {
  position:relative;
  background:#000;
}

.template-linus-15 .tli-nav-vignettes-triangle a img,
.template-linus-15 .tli-nav-vignettes-carre a img{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}

.template-linus-15 .tli-nav-vignettes-triangle:after{
  content:' ';
  display:block;
  clear:both;
}

.template-linus-15 .tli-nav-vignettes-triangle canvas {
  margin:0 auto;
  display:block;
}

.template-linus-15 .tli-nav-desaturate.tli-nav-vignettes-triangle canvas:nth-child(1),
.template-linus-15 .tli-nav-desaturate.tli-nav-vignettes-triangle img {
  filter:saturate(0%);
  -webkit-filter:saturate(0%);
}

.template-linus-15 .tli-nav-vignettes-triangle canvas:nth-child(1) {
  position:relative;
  z-index:2;
}

.template-linus-15 .tli-nav-desaturate.tli-nav-vignettes-triangle canvas:nth-child(2) {
  position:absolute;
  top:0;
  left:0;
  right:0;
  z-index:1;
}

.template-linus-15.tli-nav-menuH > div{
  margin-top:35px;
  overflow:hidden;
  height:100%;
}

.template-linus-15.tli-nav-menuH > div:after{
  content:' ';
  display:block;
  width:100%;
  height:35px;
}

.template-linus-15.tli-nav-menuH > div,
.template-linus-15 .tli-nav-texte > div {
  z-index: 2;
  position: relative;
}

.template-linus-15.tli-nav-menuH a[href="#nav-close"] {
  display: block;
  width: 96%;
  padding:0 0 0 4%;
  height: 35px;
  line-height:35px;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 3;
  text-transform:uppercase;
  font-size:24px;
  background-position:100% 50%;
  background-repeat:no-repeat;
  background-color:#000;
  color:#FFF;
  text-align:left;
}

.template-linus-15.tli-nav-menuRight a[href="#nav-close"]{
  text-align:right;
  padding:0 4% 0 0;
}

.template-linus-15.tli-nav-menuH a[href="#nav-close"]:after{
  content:' ';
  position:absolute;
  height:100%;
  padding-left:20%;
  top:0;
  right:0;
  background-position:50%;
}

.template-linus-15.tli-nav-menuH.tli-nav-reverse a[href="#nav-close"]:after{
  filter:invert(100%);
  -webkit-filter:invert(100%);
}

.template-linus-15.tli-nav-menuRight a[href="#nav-close"]:after{
  right:auto;
  left:0;
}

.template-linus-15.tli-nav-menuRight.tli-nav-menuH-closed a[href="#nav-close"]:after,
.template-linus-15.tli-nav-menuH a[href="#nav-close"]:after {
  background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAA1klEQVRYR+2UMQoCMRBF3/aewZPYi2DrAaw9hF7A2kPYCWpr4RW8gGewslEGNrDIFjPJZxckqUPey8+fNIy8mpH5VIGawF8lMAWe0alSJTADrsAe2EUkFAIJPmnBS+DslSgV+IUfgA3wGUKgGG6SuQlI4LkCMniOgBQeFbA5fwCp7RfAGu8uXF8xox2wGd+2B72BFXDyNl4hYGdIJaIJpEvIJHIFZEmUCEgkSgX6JObAzVtMhUBX4g4sgNfQAsZbA8cIPPoReS8V2qd6ghC0u7kK1ARqAl/VkS4hIXBRSQAAAABJRU5ErkJggg==);
}

.template-linus-15.tli-nav-menuRight a[href="#nav-close"]:after,
.template-linus-15.tli-nav-menuH-closed a[href="#nav-close"]:after {
  background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAA2klEQVRYR+3TMWoCQRgF4M9UgVSeIF4h6dIpFl5C8ATWqXMZLyCkUcGjaOUVLFKEAYUUJuzMP2QRxmoL2fft438DPf8GPedrgNbA3TbwiHONBZU0MMcHpjhEEbmAGT7xgCPGUUQu4AlrTC5fHkbkAlJuVUQJoCqiFFANEQFUQUQBV8QGbz8OMz2fuky0BuAVWwwvgSss8PUfgFB4AkYaCIdHAFXCSwHVwksAL9iVHtyto8y9gRH2eEbWtf+2iFxAek9CLPHedWp/zbEE0GXenf/TAK2B1kDvDXwDaeUvId1wEZQAAAAASUVORK5CYII=);
}

/*scrollbar*/
.template-linus-15.tli-nav-menuH .ps-scrollbar-y-rail{
  opacity:0.2;
}
.template-linus-15.tli-nav-menuH .ps-container>.ps-scrollbar-y-rail:hover>.ps-scrollbar-y,
.template-linus-15 .ps-container>.ps-scrollbar-y-rail:active>.ps-scrollbar-y{
  width:6px;
}
.template-linus-15.tli-nav-menuH .ps-container>.ps-scrollbar-y-rail{
  width:10px;
}
.template-linus-15.tli-nav-menuH .ps-container:hover>.ps-scrollbar-y-rail:hover{
  background-color:transparent;
}

/*************************************************DEBUT Barre latérale*****************************************************/ 
    .reseaux_sociaux img {
        border: 1px solid #dadada;
        background: #cecece;
        padding: 5px;
    }
    .admin_humor {
        font-size: 10px;
    }
    #sidebar img[src="http://imgur.com/zidQbai.png"] {
        display: block;
    }
    #sidebar .title {
        font-family: Anton;
        display: block;
        font-size: 50px;
        margin-bottom: 10px;
        line-height: 50px;
    }
    #intrigue {
        background: #efefef;
        border: 1px solid #a0a0a0;
        padding: 10px;
        text-align: justify;
        font-size: 13px;
        height: 200px;
        overflow: auto;
        margin-bottom: 20px;
    }

    .membredumois {
        border: 3px solid #1d1d1d;
        margin: 15px 0px;
    }
    .infobulle {
        width: 50px;
        height: 50px;
        overflow: hidden;
        display: -webkit-inline-box;
        border: 2px solid #1d1d1d;
        position: relative;
    }
    #sidebar img[src="http://imgur.com/zUg2nVE.png"] {
        display: block;
        margin-bottom: 15px;
    }
    .infobulle img {
        height: 100%;
    }
    #rplibre {
        background: #c19bca;
        font-size: 12px;
        padding: 10px;
        color: white;
        margin-bottom: 15px;
    }
    #sidebar .carre {
        width: 60px;
        margin: 2px;
        border: 1px solid #5f5f5f;
    }
    #sidebar .bubulle {
        position: relative;
    }
    #sidebar .bubulle:hover div {
        transform: scale(1);
    }
    #sidebar .bubulle div {
        position: absolute;
        background: rgba(255, 255, 255, 0.7);
        width: 207px;
        top: 15px;
        left: 22px;
        right: 0;
        margin: 0;
        height: 106px;
        overflow: auto;
        font-size: 11px;
        text-align: justify;
        padding: 10px;
        line-height: 10px;
        transform: scale(0);
        transition: 0.5s all;
    }
    #lescreditslol {
        font-size: 11px;
    }
    .sidebar_all {
        background: #bbbbbb;
        height: 100% !important;
        position: fixed;
        top: 0;
        left: 0px;
        z-index: 0;
        width: 310px !important;
    }
/*************************************************FIN barre latérale*****************************************************/ 
/*************************************************Debut QEEL*****************************************************/ 
    /* QEEL */
    .QEEL {
    margin:auto; width:900px; height:330px;
    }
    /* TITRE QEEL */
    .tleQEEL a{
    position:absolute; width:395px; height:35px; padding-top:15px;
    text-align:center; text-transform:uppercase; font-size:18px; font-family:Arial;
    background:#18B316; color:#ffffff; /* MODIFIABLE */
    }
    /* 24H QEEL */
    .dayQEEL {
    position:absolute; margin-top:65px;
    width:190px; height:255px; padding:5px; overflow:auto;
    background:#b8b8b8; color:#000000; /* MODIFIABLE */
    }
    .dayQEEL .row1 {
    background:none; padding:0;
    }
    /* IMAGE QEEL */
    .imgQEEL {
    position:absolute; margin-top:65px; margin-left:215px;
    width:180px; height:150px;
    }
    /* STATISTIQUES QEEL */
    .stsQEEL {
    position:absolute; margin-left:410px;
    width:210px; height:110px; padding:10px; overflow:auto;
    background:#cecece; color:#000000; /* MODIFIABLE */
    font-size:14px; font-family:Arial; line-height:22px; text-align:justify;
    }
    /* ANNIVERSAIRES QEEL */
    .anvQEEL {
    position:absolute; margin-top:143px; margin-left:410px;
    width:208px; height:50px; padding:10px; overflow:auto;
    border:1px solid; text-align:justify;
    border-color:#18B316; /* MODIFIABLE */
    }
    .anvQEEL .row1{
    background:none !important; padding:0 !important;
    }
    .anvQEEL .gensmall {
    font-size:9px;
    color:#000000; /* MODIFIABLE */
    }
    /* NOMBRE UTILISATEURS EN LIGNE */
    #TLUS {
    display:block; margin:auto; margin-bottom:10px;
    letter-spacing:0; font-size:9px; text-align:center;
    color:#000000; /* MODIFIABLE */
    }
    /* MEMBRES CONNECTES QEEL */
    .onlineQEEL {
    position:absolute; margin-top:230px; margin-left:215px;
    width:415px; height:90px; padding:5px; overflow:auto;
    background:#18B316; color:#000000; /* MODIFIABLE */
    font-size:11px;
    }
    /* BLOC GROUPES QEEL */
    .blocGQEEL {
    position:absolute; margin-left:655px;
    width:245px; height:330px; overflow:auto;
    text-align:center; color:#b8b8b8; line-height:14px;
    background:#b8b8b8; /* MODIFIABLE */
    }
    /* GROUPE QEEL */
    .blocGQEEL a {
    display:block;
    padding:3px; margin-bottom:2px;
    font-size:16px; font-weight:bold; text-transform:uppercase;
    }
/*************************************************Fin QEEL*******************************************************/
/* PRESENTATION LISTE SUJETS */
/* BLOC LISTE SUJETS */
#LSBJ {
width:900px; margin:auto;
background:none; /* MODIFIABLE */
}
/* BLOC SUJET */
.SBJ {
width:900px; margin:15px auto 0; text-align:center;
}
/* OUTIL MODERATION */
.modSBJ {
position:absolute; z-index:3; margin-left:-15px; margin-top:55px;
}
/* BLOC ICÔNES / VUES & REPONSES LISTE SUJETS */
#ivrSBJ {
display:inline-block; vertical-align:top;
width:75px; height:90px;
}
.ivrSBJ {
position:relative;
width:75px; height:90px; overflow:hidden;
}
/* ICÔNES LISTE SUJETS */
.imgSBJ {
width:75px; height:90px;
}
/* VUES LISTE SUJETS */
.vuesSBJ {
position:absolute; z-index:2; margin-top:-200px;
width:75px; height:35px; padding-top:10px;
background:rgba(250,250,250,0.8); color:black; /* MODIFIABLE */
font-size:11px; text-align:center;
opacity:0; transition:all 0.45s ease; -webkit-transition:all 0.45s ease;
}
.ivrSBJ:hover .vuesSBJ {
margin-top:-90px; opacity:1;
}
/* REPONSES LISTE SUJETS */
.repSBJ {
position:absolute; z-index:2; margin-top:0px;
width:75px; height:35px; padding-top:10px;
background:rgba(250,250,250,0.6); color:black; /* MODIFIABLE */
font-size:11px; text-align:center;
opacity:0; transition:all 0.45s ease; -webkit-transition:all 0.45s ease;
}
.ivrSBJ:hover .repSBJ {
margin-top:-45px; opacity:1;
}
/* BLOC TITRE/DESCRIPTION/AUTEUR LISTE SUJETS */
.tleSBJ {
display:inline-block; vertical-align:top;
width:505px; height:75px; padding:15px 5px 0; overflow:hidden;
font-family:Arial; background:black; color:#C1BFB7; /* MODIFIABLE */
text-align:center; text-transform:uppercase; font-size:20px;
}
/* TITRE LISTE SUJETS */
.tleSBJ a {
color:#C1BFB7 !important; /* MODIFIABLE */
}
/* DESCRIPTION LISTE SUJETS */
.descSBJ {
font-size:16px; font-style:italic;
}
/* AUTEUR TITRE LISTE SUJETS */
.nameSBJ {
font-size:14px;
}
/* DERNIER MESSAGE LISTE SUJETS */
.lmsgSBJ {
display:inline-block;
width:300px; height:75px; padding:15px 0 0; overflow:hidden;
font-family:Arial; background:#242424; color:#C1BFB7; /* MODIFIABLE */
text-align:center; text-transform:uppercase;
}
/* AUTEUR DERNIER MESSAGE LISTE SUJETS */
.lmsgSBJ .gensmall {
font-size:20px;
}
/* LISTE DES PAGES */
.gotoSBJ {
width:870px; text-align:right; font-size:9px;
}
/*************************************************DEBUT sujet**********************************************/
/* PRESENTATION DU SUJET */
/* TITRE SUJET */
#tlePOST{
margin:5px auto; padding:15px 0; border-radius:0px;
background:rgba(255,255,255,0.7); color:black; font-family:Arial; /* MODIFIABLE */
text-transform:uppercase; text-align:center;
}
#tlePOST h1 {
display:block; font-size:32px;
}
/* BLOC PSEUDONYME */
.namePOST {
margin:5px auto 0; padding:15px 0; text-align:left; border-radius:0px 0px 0 0;
background:black; font-family:Arial;  /* MODIFIABLE */
font-size:42px; text-transform:uppercase;
}
/* ICÔNE EN LIGNE */
.onPOST {
display:inline-block; vertical-align:middle; margin-left:10px;
}
/* TRAIT TEXTE RANG */
.rankPOST::before {
content:''; display:inline-block; vertical-align:middle; margin-right:5px;
width:50px; height:1px;
background:white; /* MODIFIABLE */
}
/* TEXTE RANG */
.rankPOST {
display:inline-block; vertical-align:middle;
text-transform:uppercase; font-size:11px; opacity:0.8;
color:white; /* MODIFIABLE */
}
/* BLOC AVATAR & INFORMATIONS JOUEUR */
.boxPOST {
padding:10px;
background:#F2F2F2; /* MODIFIABLE */
}
/* BLOC INFORMATIONS JOUEUR */
.abtPOST {
margin:10px auto 5px;
width:100%; text-align:left;
}
/* INFORMATION JOUEUR */
.abtPOST div{
margin-bottom:5px;
padding:5px; border:1px solid;
text-transform:uppercase; font-size:10px;
border-color:lightgrey; background:white; /* MODIFIABLE */
}
/* INTITULES INFORMATIONS JOUEUR */
.abtPOST span{
font-weight:bold; /* MODIFIABLE */
}
/* REDIMENSIONNEMENT IMAGES INFORMATIONS JOUEUR */
.abtPOST div img {
margin:auto; max-width:95%;
}
/* IMAGE RANG */
.imgrankPOST img {
margin:auto; max-width:100%;
}
/* BLOC MESSAGE */
.msgPOST {
background:white; /* MODIFIABLE */
}
/* BLOC DATE MESSAGE / OUTILS MODERATION */
.tktPOST {
margin:5px auto; width:90%; padding:5px; text-align:right;
}
/* DATE MESSAGE */
.datePOST {
display:inline-block; vertical-align:middle;
font-size:12px; text-transform:uppercase; color:black; /* MODIFIABLE */
}
/* CITER / EDITER / SUPPRIMER / IP */
.toolsPOST {
display:inline-block; vertical-align:middle; margin-left:15px;
}
/* APPARENCE MESSAGE */
div.postbody {
padding:15px; text-align:justify;
color:black; /* MODIFIABLE */
}
/* IMAGES CONTACT JOUEUR */
.ktactPOST {
padding:5px 0; text-align:center; border-radius:0 0 0px 0px;
background:grey; /* MODIFIABLE - MESSAGES DES INVITES */
}
/*************************************************FIN sujet**********************************************/
/*************************************************Debut PA**********************************************/
    /* PA */
    /* BLOC LIENS */
    .lksSHAM {
    background:#89CEEA !important;
    }
    /* LIEN BLOC LIENS */
    .lksSHAM a{
    color:#ffffff !important;
    }
    /* SURVOL LIEN BLOC LIENS */
    .lksSHAM a:hover {
    color:#000000 !important;
    }
    /* CONTEXTE */
    .ctxtSHAM {
    background:#b8b8b8 !important; color:#ffffff !important;
    }
    /* BLOC STAFF */
    .staffSHAM{
    background:#18B316 !important;
    }
    /* CONTENU STAFF */
    .staffSHAM ul li {
    color:#ffffff !important;
    }
    /* BULLE STAFF */
    .staffSHAM .bullSHAM label {
    background:#ffffff !important;
    }
    /* SURVOL BULLE STAFF */
    .staffSHAM .bullSHAM label:after {
    background:#89CEEA !important;
    }
    /* PREDEFINIS MASCULINS */
    .HSHAM {
    background-image:url(http://nsa37.casimages.com/img/2016/08/14/160814082653293945.png) !important; border-color:#cecece !important; color:#cecece !important;
    }
    /* PREDEFINIS FEMININS */
    .FSHAM {
    background-image:url(http://nsa38.casimages.com/img/2016/08/14/160814082653380252.png) !important; border-color:#cecece !important; color:#cecece !important;
    }
    /* BLOC NOUVELLES */
    .newsSHAM {
    background:#18B316 !important; color:#ffffff !important;
    }
    /* CONTENU NOUVELLES */
    .newsSHAM div {
    background:#18B316 !important; color:#fffff !important;
    }
    /* EVENEMENT EN COURS */
    .eventSHAM p{
    background:#b8b8b8!important; color:#ffffff !important;
    }
    /* MEMBRE DU MOIS */
    .mdmSHAM p{
    background:#cecece !important; color:#ffffff !important; 
    }
    /* LIENS MEMBRE DU MOIS */
    .mdmSHAM a{
    color:#000000 !important; 
    }
    /* TOP-SITES */
    .topSHAM {
    background:#89CEEA !important; color:#ffffff !important;
    }
/*************************************************Fin PA**********************************************/
/* BLOC TITRE CATEGORIE */
.tleCAT{
margin:5px auto 15px; width:900px; padding:20px 0; text-align:center;
background:none;
}
/* TITRE CATEGORIE */
.tleCAT h2{
margin:0;
font-size:32px; text-transform:uppercase; letter-spacing:3px;
color:white; font-family:Arial; /* MODIFIABLE */
}
/* BLOC FORUM */
.FRM {
margin:auto; margin-bottom:10px;
width:800px; height:250px; text-align:center;
}
/* BLOCS POSITIONNEMENT */
.boxFRM {
display:inline-block; vertical-align:top;
}
.boxFRMII {
display:inline-block; vertical-align:top; margin:0 15px;
width:230px;
}
/* BLOC TITRE FORUM */
.tleFRM {
width:395px; height:35px; padding-top:15px;
text-align:center; text-transform:uppercase; font-size:18px; font-family:Arial;
background:grey; /* MODIFIABLE */
}
/* TITRE FORUM */
.tleFRM a{
color:black !important;  /* MODIFIABLE */
}
/* DESCRIPTION FORUM */
.descFRM {
display:inline-block; vertical-align:top; margin-top:15px; margin-right:15px;
width:190px; height:170px; padding:5px; overflow:auto;
background:white; color:black; /* MODIFIABLE */
font-size:11px; text-align:justify;
}
/* IMAGE DESCRIPTIVE */
.descFRM img {
position:absolute; z-index:3; margin-left:405px; margin-top:-70px;
width:230px; height:100px;
transition:all 0.55s; -webkit-transition:all 0.55s;
}
.descFRM img:hover {
opacity:0;
}
/* AVATAR DERNIER POSTEUR FORUM */
#avaFRM {
display:inline-block; vertical-align:top; margin-top:15px;
width:180px; height:140px; overflow:hidden;
background:#dedede; /* MODIFIABLE */
}
#avaFRM img {
width:180px; filter:grayscale(1); -webkit-filter:grayscale(1);
}
/* ICÔNES FORUM */
.imgFRM {
margin-bottom:15px;
width:230px; height:100px;
}
/* NOMBRE SUJETS FORUM */
.nbFRM {
display:inline-block; vertical-align:top;
width:110px; height:65px; padding-top:25px;
font-size:24px; text-transform:uppercase; text-align:center;
background:black; color:white; /* MODIFIABLE */
}
/* NOMBRE MESSAGES FORUM */
.nbFRMII {
display:inline-block; vertical-align:top; margin-left:10px;
width:110px; height:65px; padding-top:25px;
font-size:24px; text-transform:uppercase; text-align:center;
background:#64B3AC; color:white; /* MODIFIABLE */
}
/* DERNIER MESSAGE FORUM */
.lmsgFRM {
position:absolute; margin-top:-25px; margin-left:215px;
width:415px; height:15px; padding:5px; overflow:auto;
background:white; color:black; /* MODIFIABLE */
font-size:11px; text-align:center; text-transform:uppercase;
}
/* BLOC SOUS-FORUMS */
.sfFRM {
display:inline-block; vertical-align:top;
width:135px; height:240px; padding:5px 5px 0; overflow:auto;
background:grey; /* MODIFIABLE */
text-align:center; line-height:0px; color:rgba(0,0,0,0);
}
/* LIEN SOUS-FORUM */
.sfFRM a{
display:block; margin-bottom:5px; padding:5px;
text-transform:uppercase; text-align:center; font-size:10px; line-height:14px;
background:white; color:grey; /* MODIFIABLE */
}
/* FOND TITRE CATEGORIE 1 */
div#cat1 {
background-color:red;
}
/* FOND TITRE CATEGORIE 2 */
div#cat2 {
background-color:blue;
}
/* FOND TITRE CATEGORIE 3 */
div#cat3 {
  background-color:green;}
/**********************************************************************************************************************/
body {
background-image: url(http://nsa38.casimages.com/img/2017/05/02/170502033504559698.png), url(http://nsa37.casimages.com/img/2017/05/02/170502080840442399.png);
background-position: top center, top right;
background-repeat: no-repeat, no-repeat;
background-attachment: scroll, fixed;
background-color:#cecece;
position: relative;
}
/***************************************************************************************************************************/
    .secondarytitle, .secondarytitle ~ th {
    background: none !important;
    }
    /* catégorie 1 */
    tr#cat1 {
    background-color: red;
    }
    /* catégorie 2 */
    tr#cat2 {
    background-color: pink;
    }
/*****************************************************************************************************************/
.bodylinewidth{
  position: absolute;
    right: 328px;
    top: 80px;
}
/*******************************************/

Est-ce que, jusque là, c'est bon pour toi ?


Revenir en haut Aller en bas

Error

avatar

Mes clubs


En savoir plus
Mes clubs extra-scolaires:
Voir le profil de l'utilisateur http://lessims4france.forum-officiel.fr/
Etudiante
Bons Points (BP) : 62

MessageSujet: Re: [codage] décalage selon la taille des écrans   Mer 7 Juin - 22:54

heeeeeeeu soucis ... xDDD



je suis maudite à ce point ? xD


Revenir en haut Aller en bas

Error

avatar

Mes clubs


En savoir plus
Mes clubs extra-scolaires:
Voir le profil de l'utilisateur http://lessims4france.forum-officiel.fr/
Etudiante
Bons Points (BP) : 62

Bunny Lune

avatar

Mes clubs


En savoir plus
Mes clubs extra-scolaires:
Voir le profil de l'utilisateur http://rpg-world.forumactif.fr/
Directrice en stage
Bons Points (BP) : 1791

MessageSujet: Re: [codage] décalage selon la taille des écrans   Dim 11 Juin - 22:20

Bonsoir Error Smile

Dans cette section d'aide, les élèves sont 7 jours pour répondre comme ceux qui leur viennent en aide. Il est donc autorisé d'UP après ce laps de temps.

Donc ne t'inquiète pas ta demande d'aide n'est pas oubliée. Wink




Merci pour vos cadeaux:
 
Mes Diplômes:
 
Revenir en haut Aller en bas

Error

avatar

Mes clubs


En savoir plus
Mes clubs extra-scolaires:
Voir le profil de l'utilisateur http://lessims4france.forum-officiel.fr/
Etudiante
Bons Points (BP) : 62

MessageSujet: Re: [codage] décalage selon la taille des écrans   Lun 12 Juin - 0:07

aaawh désolée T.T (j'ai trop pris l'habitude des 24/48 H xD)


Revenir en haut Aller en bas

Miettes

avatar

Mes clubs


En savoir plus
Mes clubs extra-scolaires:
Voir le profil de l'utilisateur
Intervenante
Bons Points (BP) : 212

MessageSujet: Re: [codage] décalage selon la taille des écrans   Lun 19 Juin - 9:45

Coucou Smile

Gros souci perso qui ont fait que je n'avais envie de rien (quand le moral flanche, y a rien qui va....)

Quand je vais sur le forum donné dans le premier message, il n'y a plus aucun affichage :/


Revenir en haut Aller en bas

Error

avatar

Mes clubs


En savoir plus
Mes clubs extra-scolaires:
Voir le profil de l'utilisateur http://lessims4france.forum-officiel.fr/
Etudiante
Bons Points (BP) : 62

MessageSujet: Re: [codage] décalage selon la taille des écrans   Aujourd'hui à 14:28

coucou ! ouais je sais pas vraiment ce qu'il y a eu, j'ai eu un gros soucis, le forum est devenus vierge alors que je n'y ai pas touché depuis que tu m'as donné les codes ...

J'ai donc essayer de faire un autre "thème" mais ça ne marche pas (enfin ne me plais pas)
je ne sais donc pas quoi faire, j'ai tout perdu ...


Revenir en haut Aller en bas

MessageSujet: Re: [codage] décalage selon la taille des écrans   

Revenir en haut Aller en bas
[codage] décalage selon la taille des écrans
Page 1 sur 1
 Sujets similaires
-
» Bannière de fond qui ne se réduit pas selon la taille de l'écran. Urgent plese !
» largeur du forum trop grande pour differentes taille d'écrans
» Décalage de la barre de navigation
» code css taille bordure cadre des tables
» Redimentionner le background selon la résolution du visiteur
Réponse rapide

School of Progress :: La bibliothèque :: Besoin d'aide ?+