Afficher l'image "rang" au dessus de l'image "avatars" sans espacements.

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Afficher l'image "rang" au dessus de l'image "avatars" sans espacements.

Message par tony59 le Jeu 26 Avr 2012 - 14:29

Bonjour,

J'aimerais faire en sorte que les images de "rangs" soit affichées directement au dessus des images "avatars" sans aucun espacement.
En sachant que tout ou presque a déjà été modifié sur mon forum à propos de ça

Mon forum est en phpBB2 du lien http://goo.gl/GOTio
Son template viewtopic_body :
Spoiler:

Code:
   

Supprimé



Dernière édition par tony59 le Dim 29 Avr 2012 - 12:59, édité 1 fois

tony59
*****

Masculin
Messages : 618
Inscrit(e) le : 23/10/2010

http://www.leforumsecret.com
tony59 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Afficher l'image "rang" au dessus de l'image "avatars" sans espacements.

Message par tony59 le Jeu 26 Avr 2012 - 14:31

Désolé du double post mais ce n'est pas possible de tout mettre dans le premier message sinon "la longueur dépasse la limite autorisée".


Voici le CSS du forum :
Spoiler:
Code:
/* CSS pour modifier la taille des images dans les sujets */
div.postbody img { max-width: 825px; max-height: 525px; }

/* CSS pour jQuery lightBox plugin @copyright (c) 2008 Leandro Vieira Pinho (leandrovieira.com) */
#jquery-overlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 90;
    width: 100%;
    height: 500px;
}
#jquery-lightbox {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    text-align: center;
    line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
    position: relative;
    background-color: #fff;
    width: 250px;
    height: 250px;
    margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
    position: absolute;
    top: 40%;
    left: 0%;
    height: 25%;
    width: 100%;
    text-align: center;
    line-height: 0;
}
#lightbox-nav {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
    width: 49%;
    height: 100%;
    zoom: 1;
    display: block;
}
#lightbox-nav-btnPrev {
    left: 0;
    float: left;
}
#lightbox-nav-btnNext {
    right: 0;
    float: right;
}
#lightbox-container-image-data-box {
    font: 10px Verdana, Helvetica, sans-serif;
    background-color: #fff;
    margin: 0 auto;
    line-height: 1.4em;
    overflow: auto;
    width: 100%;
    padding: 0 10px 0;
}
#lightbox-container-image-data {
    padding: 0 10px;
    color: #666;
}
#lightbox-container-image-data #lightbox-image-details {
    width: 70%;
    float: left;
    text-align: left;
}   
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
    display: block;
    clear: left;
    padding-bottom: 1.0em;   
}           
#lightbox-secNav-btnClose {
    width: 66px;
    float: right;
    padding-bottom: 0.7em;   
}

{ text-decoration: none; }
blink {
          visibility: expression((function(){
          if (!window.IEBlink) {
          window.IEBlink = "visible";
          setInterval(function() {
          window.IEBlink = (window.IEBlink=="visible"?"hidden":"visible");
          var blinks = document.getElementsByTagName("blink");
          for (var i=0; i < blinks.length; i++) { blinks[i].style.visibility=window.IEBlink; }
          }, 700)
          }
          return "";
          })());
        }

  /* Début - style pour vérification pseudo à l'inscription */
#username_reg {
  color: #a90c0c;
}
#username_reg.okusername {
  color: #2f9122;
}
/* Fin - style pour vérification pseudo à l'inscription */

    a { text-decoration: none; }
.colorpicker {
  width: 356px;
  height: 176px;
  overflow: hidden;
  position: absolute;
  background: url(http://goo.gl/4Ptts);
  font-family: Arial, Helvetica, sans-serif;
  display: none;
}
.colorpicker_color {
  width: 150px;
  height: 150px;
  left: 14px;
  top: 13px;
  position: absolute;
  background: #f00;
  overflow: hidden;
  cursor: crosshair;
}
.colorpicker_color div {
  position: absolute;
  top: 0;
  left: 0;
  width: 150px;
  height: 150px;
  background: url(http://goo.gl/zMLUm);
}
.colorpicker_color div div {
  position: absolute;
  top: 0;
  left: 0;
  width: 11px;
  height: 11px;
  overflow: hidden;
  background: url(http://goo.gl/QWjxV);
  margin: -5px 0 0 -5px;
}
.colorpicker_hue {
  position: absolute;
  top: 13px;
  left: 171px;
  width: 35px;
  height: 150px;
  cursor: n-resize;
}
.colorpicker_hue div {
  position: absolute;
  width: 35px;
  height: 9px;
  overflow: hidden;
  background: url(http://goo.gl/ZmaO6) left top;
  margin: -4px 0 0 0;
  left: 0px;
}
.colorpicker_new_color {
  position: absolute;
  width: 60px;
  height: 30px;
  left: 213px;
  top: 13px;
  background: #f00;
}
.colorpicker_current_color {
  position: absolute;
  width: 60px;
  height: 30px;
  left: 283px;
  top: 13px;
  background: #f00;
}
.colorpicker input {
  background-color: transparent;
  border: 1px solid transparent;
  position: absolute;
  font-size: 10px;
  font-family: Arial, Helvetica, sans-serif;
  color: #898989;
  top: 4px;
  right: 11px;
  text-align: right;
  margin: 0;
  padding: 0;
  height: 11px;
}
.colorpicker_hex {
  position: absolute;
  width: 72px;
  height: 22px;
  background: url(http://goo.gl/SfqDK) top;
  left: 212px;
  top: 142px;
}
.colorpicker_hex input {
  right: 6px;
}
.colorpicker_field {
  height: 22px;
  width: 62px;
  background-position: top;
  position: absolute;
}
.colorpicker_field span {
  position: absolute;
  width: 12px;
  height: 22px;
  overflow: hidden;
  top: 0;
  right: 0;
  cursor: n-resize;
}
.colorpicker_rgb_r {
  background-image: url(http://goo.gl/yGnwB);
  top: 52px;
  left: 212px;
}
.colorpicker_rgb_g {
  background-image: url(http://goo.gl/n8Mj4);
  top: 82px;
  left: 212px;
}
.colorpicker_rgb_b {
  background-image: url(http://goo.gl/Kc5d4);
  top: 112px;
  left: 212px;
}
.colorpicker_hsb_h {
  background-image: url(http://goo.gl/97xwY);
  top: 52px;
  left: 282px;
}
.colorpicker_hsb_s {
  background-image: url(http://goo.gl/DlZ8F);
  top: 82px;
  left: 282px;
}
.colorpicker_hsb_b {
  background-image: url(http://goo.gl/MJU25);
  top: 112px;
  left: 282px;
}
.colorpicker_submit {
  position: absolute;
  width: 22px;
  height: 22px;
  background: url(http://goo.gl/Lmk3S) top;
  left: 322px;
  top: 142px;
  overflow: hidden;
}
.colorpicker_focus {
  background-position: center;
}
.colorpicker_hex.colorpicker_focus {
  background-position: bottom;
}
.colorpicker_submit.colorpicker_focus {
  background-position: bottom;
}
.colorpicker_slider {
  background-position: bottom;
}

    .ces1 {color : #ff0829;font-weight: bold;}

.bodyline {
      -moz-border-radius-topright: 80px;
      -moz-border-radius-topleft: 80px;
      -moz-border-radius-bottomright: 80px;
      -moz-border-radius-bottomleft: 80px;
        margin:-1;
      padding:-1;
      background: url(http://goo.gl/c2Rf5) no-repeat center fixed;
      -webkit-background-size: cover; /* pour Chrome et Safari */
      -moz-background-size: cover; /* pour Firefox */
      -o-background-size: cover; /* pour Opera */
      background-size: cover; /* version standardisée */
-moz-border-radius:0px 0px 0px 0px; /* pour mozilla */
-webkit-border-radius: 0px 0px 0px 0px; /* pour chrome et safari */
border-radius:0px 0px 0px 0px; /* réglage des arrondis */
}

input,textarea, select {
border:2px solid #00000;
border-radius: 8px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;}

.numeroid { ... }

.class
{background-color: black;}

.cadreinfo{
background-repeat: no-repeat;
  background-image: url(http://goo.gl/N43mh);
  background-color: #b5bec6;
        border: 2px solid #000000;
  min-height: 83px;
  background-position: 5px 5px;
  padding-left: 85px;
  color: #000;
  font-family: Verdana, Geneva, sans-serif;
  font-size: 12px;
  width: 80%;
    margin: 5px;
      padding-right: 3px;
      padding-top: 3px;
      padding-bottom: 3px;
}

.mpmsg {
background-color : #ffffff;
color: #FE0101;
background-image:url("http://goo.gl/y3dzk");
}

body {

  font-size:1em;

}

    /*Cadre de l'avatar*/
      .cadravatar  {
    border : 0px solid #000000;
    margin-right : 20px; /*marge à droite pour incorporation du triangle obligatoire*/
    margin-left : 20px; /*marge à gauche pour égaliser, vous pouvez l'enlever si besoin*/
    }

    /*Bulle autour du message*/
    .bulle{
    background-color : #ffffff; /*couleur du fond de la bulle*/
    border : 1px solid #150061; /*couleur de la bordure*/
    -moz-border-radius: 10px ; /*adapter les arrondis en réglant le 10px des 4 phrases*/
    -webkit-border-radius:10px;
    -border-radius:10px;
    -khtml-border-radius:10px;
    padding : 5px; /*espacement interne obligatoire pour éviter les débordements de texte et d'images*/
    }
    /*Image du triangle de la bulle*/
    .attache {
      background-image : url("http://goo.gl/zz6Wt"); /*Image du triangle de la bulle à vous de faire la votre, vous pouvez prendre modèle sur la mienne*/
    width: 20px; /*largeur de l'image à remettre, obligatoire*/
    height :20px; /*hauteur de l'image à remettre, obligatoire*/
    position : relative;
    top :70px; /*à régler si besoin il s'agit de la position en hauteur initiale de l'image par rapport à celle qu'elle aura en visuel, obligatoire*/
    left :-19px; /*idem, mais en largeur, calculer facilement, largeur de l'image -1, obligatoire*/
    }

body {
filter:alpha(opacity=97);
-moz-opacity:0.97;
-khtml-opacity: 0.97;
opacity: 0.97;
}

/* CADRE VERT */
.vert{
  background-repeat: no-repeat;
  background-image: url("http://goo.gl/zhFF9");
  padding: 10px;
  width: 500px;
  height: 70px;
  color:#F0E36B;
  font-family: Papyrus, time new roman, serif;
  text-align: center;
  background: #4E3D28;
  border: 1px solid #ffff00;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border-radius: 20px;
}

        a:hover {
        text-shadow: #ff00ff 1px 1px 1px;
        }


.post {
background-image: url('http://goo.gl/i6fgT');
}

        .fondmsg {
        background-image:url('http://goo.gl/cH8OL');
        }
.row4
        {
    background-image: url('http://goo.gl/cH8OL');
    background-repeat: repeat;
        }

.postbody a:link, .postbody a:visited {
color: #a80000;
background: url('http://goo.gl/iXZrq') bottom right no-repeat;
padding-right: 1px; /* Espacer l'image de fond de la gauche du lien. */
}
.a{
text-decoration: none !important;
}

.sondannon {
color : #ffffff;
}
    .page a {
    color : #ffffff;
    }
    .page {
    color : #ffffff;
    }

.haut
{
margin-left:96%;
margin-top:-16px;

}
.bas
{
margin-left:96%;
margin-top:-16px;
}
    .selectCode { float:right; text-transform: uppercase; cursor:pointer; }

    #savec { position:relative; }
    .save-bloc { dispay: none; color: #555!important; cursor: point; z-index: 999; padding: 5px;  border: 1px solid #BCBCBC; background: #efefef url(http://illiweb.com/fa/prosilver/bg_button.gif) repeat-x; display:none;top:20px;left:0px;position:absolute; white-space:nowrap; }
    .save-bloc div:hover { color: #050505!important; }
    .save-bloc div { cursor: pointer; }
    .save-bloc select { background: #ccc; border: 1px solid #aaa; margin-bottom: 5px; }

    #right{
    width:0px !important;}
    #left{
    width:0px !important;}

input[name=hideonline] {
 
  display:none;
}

#wrap{
        border-radius: 17px;
        -moz-border-radius: 17px;
        -webkit-border-radius: 17px;
        padding: 10px;
        border: 1.5px solid #fff}


.tdescrip{
color: #ffffff;
font-size: 8;}
        #fa_ticker_block td{background: none !important;}
        #fa_ticker_block table{background: none !important;}

                /*--- Cette partie correspond à la description du forum ---*/
                .forum-description {
background: url('http://goo.gl/0oLuN');
                      margin: auto;
                      padding: 10px;
                      color: #1D00BF;
                      width: 75%;
                      border: 1px solid #61ADBA;
                      -moz-border-radius: 14px;
                      -webkit-border-radius: 14px;
                      font-size: 12px;
                }
             
                /*--- Cette partie correspond à l'onglet "X messages dans X topics" ---*/
                .forum-stats {
background: url('http://goo.gl/0oLuN');
                      -moz-border-radius-topleft: 15px;
                      -moz-border-radius-topright: 15px;
                      -webkit-border-top-right-radius: 15px;
                      -webkit-border-top-left-radius: 15px;
                      border-top-right-radius: 15px;
                      border-top-left-radius: 15px;
                      border-bottom: 0 none !important;
                      border-left: 2px solid #61ADBA;
                      border-right: 2px solid #61ADBA;
                      border-top: 2px solid #61ADBA;
                      color: #fff;
                      font-size: 12px;
                      font-style: italic;
                      height: 15px;
                      left: 280px;
                      padding: 3px;
                      position: relative;
                      text-align: center;
                      width: 265px;
                }
             
                /*--- Cette partie correspond à l'affichage des sous-forums ---*/
                .forum-sousforum {
                      color: #fff;
                      border: 0px solid #fff;
                      border-top: 0px !important;
                      -moz-border-radius-bottomleft: 10px;
                      -moz-border-radius-bottomright: 10px;
                      -webkit-border-bottom-right-radius: 10px;
                      -webkit-border-bottom-left-radius: 10px;
                      border-bottom-right-radius: 10px;
                      border-bottom-left-radius: 10px;
                      margin: auto;
                      padding: 0px;
                      color: #1D00BF;
                      width: 70%;
                      text-align: center;
                      height: 100%;
                      font-size: 10px;
                }


        .profil_speudo {
background: url('http://goo.gl/0oLuN');
            background-color: #79F8F8;
          -moz-border-radius:10px;
          -webkit-border-radius:10px;
            border-radius:10px;
            padding:5px;
        }
       
        .profil_avatar {
background: url('http://goo.gl/0oLuN');
          background-color: #79F8F8;
          -moz-border-radius:10px;
          -webkit-border-radius:10px;
          border-radius:10px;
          padding: 5px;
        }
       
        .profil_infos {
background: url('http://goo.gl/0oLuN');
          -moz-border-radius:10px;
          -webkit-border-radius:10px;
          border-radius:10px;
          padding: 5px;
        }
       
        .font_profil{
background: url('http://goo.gl/0oLuN');
          background-color: #333333;
          -moz-border-radius:10px;
          -webkit-border-radius:10px;
          border-radius:10px;
          padding: 5px;
        }
        .maintitle {margin-top:-60px}

        #savec { position:relative; }
        .save-bloc { dispay: none; color: #555!important; cursor: point; z-index: 999; padding: 5px;  border: 1px solid #BCBCBC; background: #efefef url(http://illiweb.com/fa/prosilver/bg_button.gif) repeat-x; display:none;top:20px;left:0px;position:absolute; white-space:nowrap; }
        .save-bloc div:hover { color: #050505!important; }
        .save-bloc div { cursor: pointer; }
        .save-bloc select { background: #ccc; border: 1px solid #aaa; margin-bottom: 5px; }




/******* NUAGES ********/

#contenant_nuages
{
z-index: 1;
margin-bottom: 5px;
}
#nuages
{
position: absolute;
width: 1100px;
margin: auto;
overflow: hidden;
height: 250px;
margin-top: -250px;
margin-left: -5px;
opacity: 0.3;
-moz-opacity: 0.3;
-khtml-opacity: 0.3;
filter: alpha(opacity=30);
}
#nuages2
{
position: absolute;
width: 1100px;
margin: auto;
overflow: hidden;
height: 250px;
margin-top: -250px;
margin-left: -5px;
opacity: 0.4;
-moz-opacity: 0.4;
-khtml-opacity: 0.4;
filter: alpha(opacity=40);
}
.nuages_image
{
animation: slidein 20s linear infinite;
-webkit-animation: slidein 20s linear infinite;
-moz-animation-name: slidein;
-moz-animation-duration: 20s;
-moz-animation-timing-function: linear;
-moz-animation-iteration-count: infinite;
-o-animation: slidein 20s linear infinite;
-htm-animation: slidein 20s linear infinite;
}
.nuages_image2
{
animation: slidein 60s linear infinite;
-webkit-animation: slidein 60s linear infinite;
-moz-animation-name: slidein;
-moz-animation-duration: 60s;
-moz-animation-timing-function: linear;
-moz-animation-iteration-count: infinite;
-o-animation: slidein 60s linear infinite;
-htm-animation: slidein 60s linear infinite;
}
@keyframes slidein
{
from {margin-left: 1100px;}
to {margin-left: -1100px;}
}
@-webkit-keyframes slidein
{
from {margin-left: 1100px;}
to {margin-left: -1100px;}
}
@-moz-keyframes slidein
{
from {margin-left: 1100px;}
to {margin-left: -1100px;}
}

.bouhautbas {
            bottom: 40px;
            left: 10px; /* remplacez left par right pour afficher les boutons à droite */
            position: fixed;
            z-index: 100;
        }
Je ne sais vraiment pas comment m'y prendre, ne serait ce que pour commencer.
Je pense qu'il n'y a pas grand chose à modifier donc je me permet de me tourner vers vous au cas où quelqu'un qui s'y connait un peu aurait la gentillesse de m'aider ? :p

Merci énormément d'avance,
Tony.A.W.

tony59
*****

Masculin
Messages : 618
Inscrit(e) le : 23/10/2010

http://www.leforumsecret.com
tony59 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Afficher l'image "rang" au dessus de l'image "avatars" sans espacements.

Message par tony59 le Ven 27 Avr 2012 - 22:51

UP

tony59
*****

Masculin
Messages : 618
Inscrit(e) le : 23/10/2010

http://www.leforumsecret.com
tony59 a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Afficher l'image "rang" au dessus de l'image "avatars" sans espacements.

Message par Threax le Dim 29 Avr 2012 - 11:53

Bonjour,

Commencez par retirer le <br> de votre template :
Code:
{postrow.displayed.RANK_IMAGE}
                    <br>
                    <div class="cadravatar">

Wink

Threax
+ Hyperactif +

Masculin
Messages : 17277
Inscrit(e) le : 27/08/2005

http://lesforumsde.forumactif.com
Threax a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Afficher l'image "rang" au dessus de l'image "avatars" sans espacements.

Message par tony59 le Dim 29 Avr 2012 - 12:58

Bonjour,

Oulàà merci beaucoup, j'ai surtout tripoté un peu partout dans le css et je n'avais pas du tout vu ça, j'ai un peu honte là Smile merci encore

tony59
*****

Masculin
Messages : 618
Inscrit(e) le : 23/10/2010

http://www.leforumsecret.com
tony59 a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum