Problème de transparence

3 participants

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

Résolu Problème de transparence

Message par Aysu Ven 18 Juil 2014 - 7:47

Re-bonjour/bonsoir, c'est encore moi mais cette fois-ci afin de résoudre un problème de transparence sur mon avatar si vous le voulez bien :3

voici donc, sans plus tarder, le problème en image

Spoiler:


Comme vous pouvez le constater, la transparence s'arrête qu'à partir environ la moitié de l'avatar, or une image demi-transparente ne m'interesse pas, et je voudrais vraiment que lorqu'un des membres du forum mette une image transparente, elle le soit complètement! o/

Je vous donne tout de même mon css

Code:
.avatar img {
   width:133.5px;
}
.avatar img {
   max-width:500px;
   max-height:500px;
}

  
.signature_div img {
   text-align: center;
}

.signature_div img {
 
max-height:300px;
max-width:600px;
}

table.tableau_profil td.haut_tab{
   width:150px;
   height:15px;
   background-image:url('http://image.noelshack.com/fichiers/2014/29/1405614703-1-final.png');
   background-repeat:no-repeat;
   }
table.tableau_profil{
   width:130px;
   margin:5px;
   border:0;
   }
  

  
table.tableau_profil td.milieu_tab{
   width:150px;
   background-image:url('http://image.noelshack.com/fichiers/2014/29/1405615447-final-22.png');
   background-repeat:repeat-y;
   padding-left:7.75px;
   padding-right:7px;
   text-align:center;
   }
  
table.tableau_profil td.bas_tab{
   width:150px;
   height:15px;
   background-image:url('http://image.noelshack.com/fichiers/2014/29/1405551334-3-final.png');
   background-repeat:no-repeat;
   }
  
table.tableau_profil td.milieu_tab span.pseudo_posteur{
   font-family:Verdana;
   font-size:9pt;
   }
  
table.tableau_profil td.milieu_tab span.rang_posteur{
   font-family:Comic Sans Ms;
   font-size:10pt;
   color:white;
   font-style:italic;
   }
  
table.tableau_profil td.milieu_tab div.infos_posteur{
   width:125.25px;
   margin:auto;
   padding:4px;
   text-align:left;
   font-family:Comic Sans Ms;
   font-size:8pt;
   color:#0000ff;
   background-color:#c4b6a8;
   border:1px solid white;
   opacity:0.5; /* Transparence : 0 = transparent // 1 = opaque */
   -moz-opacity : 0.5; /* Transparence pour Firefox */
    -ms-filter: "alpha(opacity=50)"; /* Transparence pour IE 8 */
    filter : alpha(opacity=50); /* Transparence pour les versions IE antérieure à la 8 */
   }

Ainsi que mon template:

Code:
  
                          
         <table class="tableau_profil" cellpadding="0" cellspacing="0">
            <tr>
              <tr>
               <td class="haut_tab"> </td>
            </tr>
                          </tr>
            
              
               <td class="milieu_tab">
                 <br>
                  <span class="name"><a name="{postrow.displayed.U_POST_ID}"></a><span class="pseudo_posteur">{postrow.displayed.POSTER_NAME}</span></span>

  <br>
                     <span class="postdetails poster-profile">
                     <span class="rang_posteur">{postrow.displayed.POSTER_RANK}</span>
                       <br><br><div class="avatar">{postrow.displayed.POSTER_AVATAR}</div>
<br>
                     <div class="infos_posteur"><!-- BEGIN profile_field -->
                     {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
                     <!-- END profile_field -->
                      
                     {postrow.displayed.POSTER_RPG}
                      
                     </div>
                       <span>
                  </span>
<td>
               </td>
                       <tr>
            </tr>
            <tr>
               <td class="bas_tab"> </td>
            </tr>
                       <table>
         </table>

Encore un grand merci à celui qui pourra me venir en aide :3
Aysu

Aysu
Nouveau membre

Messages : 8
Inscrit(e) le : 17/07/2014

http://www.hunterxhunter.fr1.co
Aysu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème de transparence

Message par MlleAlys Ven 18 Juil 2014 - 14:28

Bonjour,
je vois en inspectant votre forum ce code css :
Code:
.avatar {
  background-color: #fff;
  border: 1px solid #a2c9db;
  width: 50px;
}
Retrouvez-le dans la feuille de style et supprimez-le, cela devrait régler le problème ^^
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème de transparence

Message par Aysu Ven 18 Juil 2014 - 18:47

Merci de ta réponse mais malheureusement je ne trouve rien ressemblant à ce que tu viens de me dire dans mon CSS

Le voici au complet:
Code:
body{width:100%;}

.avatar img {
  width:133.5px;
}
.avatar img {
  max-width:500px;
  max-height:500px;
}

 
.signature_div img {
  text-align: center;
}

.signature_div img {
 
max-height:300px;
max-width:600px;
}

table.tableau_profil td.haut_tab{
  width:150px;
  height:15px;
  background-image:url('http://image.noelshack.com/fichiers/2014/29/1405614703-1-final.png');
  background-repeat:no-repeat;
  }
table.tableau_profil{
  width:130px;
  margin:5px;
  border:0;
  }
 

 
table.tableau_profil td.milieu_tab{
  width:150px;
  background-image:url('http://image.noelshack.com/fichiers/2014/29/1405615447-final-22.png');
  background-repeat:repeat-y;
  padding-left:7.75px;
  padding-right:7px;
  text-align:center;
  }
 
table.tableau_profil td.bas_tab{
  width:150px;
  height:15px;
  background-image:url('http://image.noelshack.com/fichiers/2014/29/1405551334-3-final.png');
  background-repeat:no-repeat;
  }
 
table.tableau_profil td.milieu_tab span.pseudo_posteur{
  font-family:Verdana;
  font-size:9pt;
  }
 
table.tableau_profil td.milieu_tab span.rang_posteur{
  font-family:Comic Sans Ms;
  font-size:10pt;
  color:white;
  font-style:italic;
  }
 
table.tableau_profil td.milieu_tab div.infos_posteur{
  width:125.25px;
  margin:auto;
  padding:4px;
  text-align:left;
  font-family:Comic Sans Ms;
  font-size:8pt;
  color:#0000ff;
  background-color:#c4b6a8;
  border:1px solid white;
  opacity:0.5; /* Transparence : 0 = transparent // 1 = opaque */
  -moz-opacity : 0.5; /* Transparence pour Firefox */
    -ms-filter: "alpha(opacity=50)"; /* Transparence pour IE 8 */
    filter : alpha(opacity=50); /* Transparence pour les versions IE antérieure à la 8 */
  }
body.chatbox {
background-image: url("");
}
#chatbox_header .cattitle strong { display: none; }
#chatbox_header .cattitle:before { content: "► The Hunter Box"; }


.quote
{
 
background-color: #ffffff;
color: #000000;
font-family: Verdana, Arial;
padding-left: 10px;
padding-right: 15px;
  -moz-border-radius:20px;
  border-radius:20px;
border: none
}

.code
{
 
background-color: #ffffff;
color: #000000;
font-family: Verdana, Arial;
padding-left: 10px;
padding-right: 15px;
-moz-border-radius:20px;
  border-radius:20px;
border: none}


.spoiler_closed hidden, .spoiler_content, .spoiler_closed
{
background: #A2C9DB;

font-family: Verdana, Arial;

  color: black;
   
 
padding-left: 10px;
padding-right: 15px;
border: none
}
/**** Autres ***/




.forumline
{
background: #A2C9DB;
max-width: 990px;
margin: auto;
border-radius: 20px;
-moz-border-radius: 20px;
margin-bottom: 30px;
padding: 10px;
-moz-box-shadow: 1px 1px 5px #000;x
-webkit-box-shadow: 1px 1px 5px #000;
box-shadow: 1px 1px 5px #000;;
}


a.forumlink
                {
                display: block;
                padding-left: 20px;
                font-size: 16px;
                font-family: Trebuchet MS;
                letter-spacing: 2px;
                border-radius: 20px;
                -moz-border-radius: 20px;
                -htm-border-radius: 20px;
                -webkit-border-radius: 20px;
                -o-border-radius: 20px;
                color: #ffffff !important;
                text-shadow: 0px 0px 0.5px #ffffff;
                transform: all;
                -moz-transform: all;
                -o-transform: all;
                -htm-transform: all;
                -webkit-transform: all;
                transition: 1s;
                -moz-transition: 1s;
                -o-transition: 1s;
                -htm-transition: 1s;
                -webkit-transition: 1s;
                }
                a.forumlink:hover
                {
                padding-left: 50px;
                color: #ffffff !important;
                text-shadow: 0px 0px 1px #ffffff;
                transform: all;
                -moz-transform: all;
                -o-transform: all;
                -htm-transform: all;
                -webkit-transform: all;
                transition: 1s;
                -moz-transition: 1s;
                -o-transition: 1s;
                -htm-transition: 1s;
                -webkit-transition: 1s;
                }
/*QEEL*/
.groupes a {
font-size:15px;
margin-left:10px;
  ont-family: Times New Roman;
ext-shadow: 0px 0px 4px #ffffff;
    letter-spacing: 0px;
}
 
.QEEL1 {

width:590px;
text-align: center;
  margin-top:3px;
padding:5px;
}
.QEEL {
background-color : black;
width:300px;
  padding:5px;
text-align: justify;
  height:300px;
border-radius: 20px;
-moz-border-radius: 20px;

padding: 10px;
-moz-box-shadow: 1px 1px 5px #000;x
-webkit-box-shadow: 1px 1px 5px #000;
box-shadow: 1px 1px 5px #000;;
}
.QEEL2 {
background-color : black;
  width:300px;
text-align: justify;
  border-radius: 20px;
-moz-border-radius: 20px;

padding: 10px;
-moz-box-shadow: 1px 1px 5px #000;x
-webkit-box-shadow: 1px 1px 5px #000;
box-shadow: 1px 1px 5px #000;;
padding:5px;
  height:300px;
}

.bodyline{
background: transparent;
border: none;
}

/*------------------------------------
Template QEEL par 'Christa Lostmindy
Distribution autorisée sur :
  L'Enae Volare    : http://enaevolare.lostmindy.fr
  CSSActif      : http://www.css-actif.com/
  l'Annuaire FdF  : http://www.forumsdeforumactif.com/
----
Utilisation personnelle et non commerciale autorisée
Modification autorisée
Redistribution strictement interdite
----
Il est strictement interdit de retirer
les crédits présents dans ce code.
--------------------------------------*/
/****************************************
/* MISE EN FORME GENERALE
/****************************************/
/* mise en page générale */
#tableauQeel {
  width: 100%;
  padding: 4px;
  margin: 0 auto;
  color: #000000;
  font-size: 12px;
}
/* Liens statistiques */
.liensStats {
  margin: 5px 0;
}
.liensStats a:link {
  color: #3333cc;
}
.liensStats a:hover,
.liensStats a:active,
.liensStats a:focus {
  color: #990000;
}
.liensStats a:visited {
  color: #3333cc;
}
/* largeur bloc contenant l'image du QEEL*/
.imgOnline {
  min-width: 200px;
}
/* espacement entre certains blocs */
.espace {
  padding: 3px;
}
/* taille des cellules de tableau */
#tabBlocStats,
#tabBlocGroupes {
  width: 50%;
}
#blocStats {
  width: auto;
}
#blocGroupes {
  width: auto;
}
/*********************************
/*  TITRES DU QEEL
/*********************************/
#tableauQeel h2 {
  display: inline-block;
  font-family: "Verdana", Courier, monospace, serif;
  font-size: 10px;
  font-weight: bold;
  color: #000000;
  text-shadow: 0.1em 0.1em 0.2em #c3c7c9;
  margin-top: 4px;
  margin-bottom: 0px;
  padding: 4px 10px;
  background-color: #d1d7dc;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  -webkit-border-top-left-radius: 15px;
  -moz-border-radius-topleft: 15px;
  border-top-left-radius: 15px;
  -webkit-border-top-right-radius: 15px;
  -moz-border-radius-topright: 15px;
  border-top-right-radius: 15px;
}
#tableauQeel h2:before {
  content: "► ";
  color: #000000;
}
#tableauQeel h2:after {
  content: " ◄";
  color: #000000;
}
/*************************************
/* MISE EN FORME DES BOITES DE CONTENU
/************************************* */
.contenuQeel {
  background-color: #d1d7dc;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  padding: 4px;
  margin: 2px;
  font-size: 10px;
}
.noSpaceTitre {
  margin-top: 0;
}
.liste24h {
  text-align: center;
}
.deBug td {
  background-color: #d1d7dc;
}
/* Ce css permet d'avoir les deux premières boites (statistiques et légendes)
à la même taille en hauteur */
.hauteurFixe {
  height: 45px;
  overflow: auto;
}
/*************************************
/* MISE EN FORME LISTE DES GROUPES
/************************************* */
.qeel-groupes {
  font-size: 0px;
  line-height: 0;
  text-align: center;
}
.qeel-groupes a {
  font-size: 12px;
  line-height: normal;
  display: inline-block;
  padding: 2px 5px;
  margin: 1px 4px;
  font-variant: small-caps;
  font-weight: bold;
  background: transparent;
}
/********************************
/* Affichage des crédits
/********************************/
.lostCredits {
  color: #999999;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  padding: 2px 4px;
  background: transparent;
  font-weight: bold;
}
.bulleCredits {
  position: relative;
  cursor: pointer;
  color: #ffffff;
  background: #c3c7c9;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  padding: 1px 4px;
}
.bulleCredits  > span {
  position: absolute;
  display: block;
  bottom: 150%;
  left: -20%;
  width: 150px;
  background: #000000;
  color: #ffffff;
  padding: 2px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  opacity: 0;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
  transform: scale(0) rotate(12deg);
}
.bulleCredits  > span:after {
  display: block;
  content: " ";
  width: 0;
  border-width: 8px 5px 0 5px;
  border-color: #000000 transparent transparent transparent;
  border-style: solid;
  position: absolute;
  bottom: -8px;
  left: 5px;
}
.bulleCredits:hover  > span,
.bulleCredits:focus  > span {
  z-index: 500;
  opacity: 1;
  transform: scale(1) rotate(0);
  cursor: default;
}
/*------------------------------------
Template QEEL par 'Christa Lostmindy
http://enaevolare.lostmindy.net
[FIN]
--------------------------------------*/

.code
{
-moz-border-radius: 15px;
padding-left: 10px;
}
.quote
{
-moz-border-radius: 15px;
padding-left: 10px;
}

.button2{ -moz-border-radius: 5px;}

input,textarea, select {
border-radius: 10px 10px;
-moz-border-radius: 10px;
padding-left: 3px;
}


background-image: url(http://image.noelshack.com/fichiers/2014/28/1405161878-sans-titre2.png),
url(http://image.noelshack.com/fichiers/2014/28/1405161918-sans-titre2.png)!important;



a:hover{
text-decoration: none !important;
}
 
a {
text-decoration: none !important;
}
 
a:link {
text-decoration: none;
}
 



Aysu

Aysu
Nouveau membre

Messages : 8
Inscrit(e) le : 17/07/2014

http://www.hunterxhunter.fr1.co
Aysu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème de transparence

Message par MlleAlys Ven 18 Juil 2014 - 19:22

Oh ! ce doit être dans le css par défaut alors ><"
le mieux serait sans doute de modifier la classe dans le template, puisqu'elle est déjà utilisée ailleurs, par exemple en modifiant avatar par avatar_msg, ou autre ^^
le template :
Code:
 
                         
        <table class="tableau_profil" cellpadding="0" cellspacing="0">
            <tr>
              <tr>
              <td class="haut_tab"> </td>
            </tr>
                          </tr>
           
             
              <td class="milieu_tab">
                <br>
                  <span class="name"><a name="{postrow.displayed.U_POST_ID}"></a><span class="pseudo_posteur">{postrow.displayed.POSTER_NAME}</span></span>
 
  <br>
                    <span class="postdetails poster-profile">
                    <span class="rang_posteur">{postrow.displayed.POSTER_RANK}</span>
                      <br><br><div class="avatar_msg">{postrow.displayed.POSTER_AVATAR}</div>
<br>
                    <div class="infos_posteur"><!-- BEGIN profile_field -->
                    {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
                    <!-- END profile_field -->
                     
                    {postrow.displayed.POSTER_RPG}
                     
                    </div>
                      <span>
                  </span>
<td>
              </td>
                      <tr>
            </tr>
            <tr>
              <td class="bas_tab"> </td>
            </tr>
                      <table>
        </table>
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème de transparence

Message par Aysu Ven 18 Juil 2014 - 20:21

Merci beaucoup mais malheureusement ça ne marche toujours pas, voici ce que ça fait:

Spoiler:

Est ce je pense, parceque j'ai mis dans le template et dans le CSS un code qui permettait de redimensionner l'avat' selon mes envies, et dès lors que tu m'a donné le template modifié, ça a desactiver le code!
J'ai remis le template d'origine avec le redimensionnement! Bref, le probleme de la transparence persiste encore :v
Aysu

Aysu
Nouveau membre

Messages : 8
Inscrit(e) le : 17/07/2014

http://www.hunterxhunter.fr1.co
Aysu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème de transparence

Message par MlleAlys Ven 18 Juil 2014 - 20:49

Effectivement désolée, je l'avais oublié ! ><"

Dans votre css, vous pouvez remplacer cela :
Code:
.avatar img {
  width:133.5px;
}
.avatar img {
  max-width:500px;
  max-height:500px;
}

par ça :
Code:
.avatar_msg img {
  width:133.5px;
  max-height:500px;
}

(la propriété max-width:500px; ne sert à rien puisque que la largeur est fixée à 133.5px avec le code juste au dessus Wink )
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème de transparence

Message par Aysu Ven 18 Juil 2014 - 21:18

Encore une fois, c'est moi :3
Lorsque je fais ce que tu me dis, l'avatar devient tout petit, et tout ce qu'il y a autour disparaît.. :v

EDIT: Voila en image ce que ça donne:
Spoiler:
Aysu

Aysu
Nouveau membre

Messages : 8
Inscrit(e) le : 17/07/2014

http://www.hunterxhunter.fr1.co
Aysu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème de transparence

Message par MlleAlys Sam 19 Juil 2014 - 2:17

avec le template remodifié ? =/
MlleAlys

MlleAlys
Membre actif

Messages : 5767
Inscrit(e) le : 12/09/2012

MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème de transparence

Message par Aysu Sam 19 Juil 2014 - 3:13

Tout fonctionne!! Je te remercie te ton aide Mlle Alys :3
Au plaisir de ton aide à un futur problème, sans doute o/
Aysu

Aysu
Nouveau membre

Messages : 8
Inscrit(e) le : 17/07/2014

http://www.hunterxhunter.fr1.co
Aysu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème de transparence

Message par Chacha Sam 19 Juil 2014 - 9:42

Problème de transparence Check10Bonjour,

Afin de faciliter la gestion des problèmes, si votre problème est résolu, pensez à :
  • éditer votre premier message,
  • cocher l'icône résolu
  • Et enregistrer en cliquant sur Problème de transparence Envoi10


Vous pouvez également remercier les personnes qui vous ont aidé, en cliquant sur le bouton Problème de transparence 50378

A bientôt sur ForumActif Smile
Chacha

Chacha
Modéractif
Modéractif

Masculin
Messages : 69304
Inscrit(e) le : 21/08/2010

https://forum.forumactif.com/
Chacha 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