Afficher l'image "rang" au dessus de l'image "avatars" sans espacements.
2 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
Afficher l'image "rang" au dessus de l'image "avatars" sans espacements.
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 :
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
Re: Afficher l'image "rang" au dessus de l'image "avatars" sans espacements.
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 :
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.
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://2img.net/i/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://2img.net/i/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 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.
Re: Afficher l'image "rang" au dessus de l'image "avatars" sans espacements.
Bonjour,
Commencez par retirer le <br> de votre template :
Commencez par retirer le <br> de votre template :
- Code:
{postrow.displayed.RANK_IMAGE}
<br>
<div class="cadravatar">
Re: Afficher l'image "rang" au dessus de l'image "avatars" sans espacements.
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à merci encore
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à merci encore
Sujets similaires
» Codage (couleur) groupe au dessus des avatars.
» Afficher seulement une image dans le rang sans texte
» Comment faire pour que le "Titre du Rang" ne s'affiche plus au dessus de "L'image du rang" ?
» Modifier couleur rang ou mettre rang sans texte, seulement avec une image.
» Modifier la taille du pseudo au dessus des avatars + centrer
» Afficher seulement une image dans le rang sans texte
» Comment faire pour que le "Titre du Rang" ne s'affiche plus au dessus de "L'image du rang" ?
» Modifier couleur rang ou mettre rang sans texte, seulement avec une image.
» Modifier la taille du pseudo au dessus des avatars + centrer
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum