Problème d'opacité et de lien sur une P.A

[Druido]

Bonjour,

J'ai un gros problème avec ma P.A. A certains endroits, l'opacité n'est pas identique au reste de la P.A et les liens ne marchent pas.

Voici une image pour mieux comprendre le problème :



Et voici le code CSS :

Code:

   /* Enlever fond derrière la P.A*/

table#msg_et, table#msg_et td{
       background-color:none !important;
       }
/* Image de Fond Chatbox */
body.chatbox{
         background-image:url(http://elblogdeljugon.com/wp-content/uploads/2013/12/pokemon_x_and_y_wallpaper_by_redash2025-d68st9v-1024x576.jpg);
        }
        
       .chatbox_row_1,.chatbox_row_2,.chatbox_row_3 {
        background: none;
        }


        .tstaff{font-size:1em;}
        
       .thumbnail{position: relative;z-index: 0;}
        
       .thumbnail:hover{background-color: transparent;z-index: 50;}
        
       .thumbnail span{
        position: absolute;
        background-color: #2B2B2B;
        padding: 5px;
        left: -1000px;
        visibility: hidden;
        color: #DEDEDE;}
        
       .thumbnail span img{border: 1px groove;padding: 2px;}

        .thumbnail:hover span{
        visibility: visible;
        top: 20px;
        left: 15px;
        width: 150px;}
/* Accueil fond transparent */

        .bodyline {
            background-color:transparent;
            background-image:url('http://img15.hostingpics.net/pics/198623fondtransparent.png');
}

        .bodyline{
        border-radius: 20px;
        }
/* Contours Image de profil */
  .postdetails.poster-profile a img
        {
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
        border-left: 5px solid  #2461C9;
        border-right: 5px solid  #2461C9;
        }

        #essaye, .forumline {
            background: none!important;
        }

/* P.A by Lapinou */

    div#pa{
      width:900px;
      height:800px;
      background:#423B3B;
    
     border:5px solid #586ea9;
      border-radius:15px;
    
     padding:25px;
    
     font-family: 'Exo 2', sans-serif;
      color:#000;
      font-size:11px;
      text-align:center;
    }

    .titre{
    
     font-size:25px;
      font-family: 'Exo 2', sans-serif;
      text-align:center;
      text-transform:uppercase;
      font-weight:bold;
      font-style:italic;
      color:#406BA4;
    }



    div#colonne1 {
        float: left;
        width: 220px;
        height:600px;
        margin-right: 10px;
    
     padding:10px;
    }

    div #colonne1 .cadre1{
      width:220px;
      height:350px;
      overflow:auto;
      background:#fff;
      border:5px solid #b45443;
      border-radius:15px;
      padding:5px;
    
     }


    .fond1{
      background-image:url("http://imageshack.us/a/img849/8383/h7ze.jpg");
      background-size:100% 100%;
      opacity:0.4;    
     width:210px;
      height:360px;
      margin-top:-365px;
      margin-left:10px;
    }


    div #colonne1 .cadre2{
      width:220px;
      height:200px;
      background:#fff;
      border:5px solid #b45443;
      border-radius:15px;
      margin-top:15px;
      padding:5px;
    }

    .fond2{
      width:230px;
      height:210px;
      background-image:url("http://umi-no-hoshi.u.m.pic.centerblog.net/535a0854.jpg");
      background-size:100% 100%;
      opacity:0.4;
     margin-top:-215px;
      margin-left:5px;
      border-radius:8px;
    }
    
   div#colonne2 {
        float: right;
        width: 200px;

    
     margin-left:10px;
      padding:10px;
    }

    div#colonne2 .cadre3{
      width:180px;
    
   }

    div#colonne2 .cadre4{
      width: 205px;
        height:445px;
      overflow:auto;
      background:#fff;
      
       border:5px solid #b45443;
      border-radius:15px;
    
     margin-top:26px;
      margin-left:-10px;
      padding:5px;
    
   }

    .fond4{
      width:200px;
      height:445px;
      background-image:url("http://imagizer.imageshack.us/a/img843/1513/y0kt.jpg");
        background-size:100% 100%;
      opacity:0.4;
  margin-top:-460px;
      margin-left:-5px;
      
   }

    div#centre {
        overflow:hidden;
    
     padding:10px;
    }




    div #centre .cadre5{
      width:390px;
      height:280px;
      background:#fff;
    
     border:5px solid #b45443;
      border-radius:15px;
      padding:5px;
      margin-top:-2px;
    
     text-align:justify;
    }

    .fond5{
      width:400px;
      height:290px;
      background-image:url("http://imageshack.us/a/img822/3827/dczb.png");
      background-size:100% 100%;
      border-radius:7px;
  opacity:0.4;
      margin-top:-295px;
      margin-left:5px;
    }

    div #centre .cadre6{
      width:390px;
      height:280px;
      background:#fff;
    
     border:5px solid #b45443;
      border-radius:15px;
    
   }

    .fond6{
      width:390px;
      height:280px;
      background-image:url("http://imageshack.us/a/img818/7083/2yul.png");
      background-size:100% 100%;
      margin-top: -284px;
      margin-left:5px;
      border-radius:5px;
      opacity:0.4;
    }

    .staff{
    
     width:300px;
      height:5px;
      margin-left:50px;
      text-align:center;
    
   
   
   
   }


    .transition-NU1{
    position: relative;
    width: 75px;
      height:75px;
    float: left;
    margin: 5px;
    padding: 0;
      border-radius:50px;
      padding-top:10px;
    }
    /* INFOBULLE */
    .NU_transition1{

     /*Couleur du texte*/
      border-radius: px;
        padding:px;
     background:#423B3B;
      text-align:justify;
    width: 0;
    height: 0;
      margin-top:-60px;
      margin-left:-50px;
    overflow: hidden;
    position: absolute;
    left:20px;
    top: 20;
    z-index: 999;
    padding: 0;
    text-align: center;
    border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
    -webkit-transition: width 0.8s ease-in 0.2s, height 0.8s ease-in 0.2s, padding 0.8s ease-in 0.2s; /* pour navigateur webkit */
    -moz-transition: width 0.8s ease-in 0.2s, height 0.8s ease-in 0.2s, padding 0.8s ease-in 0.2s; /* pour navigateur mozilla */
    -o-transition: width 0.8s ease-in 0.2s, height 0.8s ease-in 0.2s, padding 0.8s ease-in 0.2s; /* pour navigateur opera */
    transition: width 0.8s ease-in 0.2s, height 0.8s ease-in 0.2s, padding 0.8s ease-in 0.2s; /* pour les navigateurs récents */
    }
    /* INFOBULLE AU SURVOL */
    .transition-NU1:hover .NU_transition1{
    height: 150px;
    width: 150px;
    padding: 0px;
    border-width: 1px;
      border:1px solid #586ea9 ;
      background:#423B3B;
      padding-top:10px;
    }
    /* IMAGE (icône) */
    .transition-NU1 img {
    position: relative;
      border-radius:7px;
    z-index: 990;
    
   left: 0;
    bottom: 0;
      box-shadow: 0px 0px 5px #c1b4ba;
    -webkit-transition: all 1s linear 0s;/* pour navigateur webkit */
    -moz-transition: all 1s linear 0s; /* pour navigateur mozilla */
    -o-transition: all 1s linear 0s;/* pour navigateur opera */
    transition: all 1s linear 0s; /* pour les navigateurs récents */
    }
    /* IMAGE (icône) AU SURVOL */
    .transition-NU1:hover img {
    -webkit-transition: rotate(360deg);/* pour navigateur webkit */
    -moz-transform: rotate(360deg); /* pour navigateur mozilla */
    -o-transform: rotate(360deg);/* pour navigateur opera */
    transform: rotate(360deg); /* pour les navigateurs récents */
    }
      
     
   

   a{
        text-decoration: none;
      color: black;}

    
   



   div #pied{
      width:890px;
      height:150px;
    
     background-image:url("http://imageshack.us/a/img689/4726/gqab.jpg");
      background-size:100% 100%;
      border:5px solid #b45443;  
  border-radius:15px;
  opacity:0.5;
      margin-top:5px;
    
   }

    .fondpied
    {
}

/* ********** CATEGORIE ********** */

#descripti{
      width:540px;
height: 150px;
font-family:  Georgia;
font-size: 12px;
background-color: #343434;
text-align: justify;
padding-left: 30px;
padding-right: 10px;
margin-bottom: 10px;
margin-top:6px;
-moz-border-radius:40px 40px 0px 0px;
-webkit-border-radius:40px 40px 0px 0px;
background-image: url(http://img4.hostingpics.net/pics/585758test12.png);
}

.lienss
{
width:570px;
height: 30px;
Border-top: 3px double #1F6AED;
font-weight:  normal;
font-family:Georgia;
font-size: 10px;
padding-left:10px;
margin-top:-20px;
padding-top:10px;
background-color: #343434;
-moz-border-radius:0px 0px 40px 40px;
-webkit-border-radius:0px 0px 40px 40px;}

.descriptiion{
width:410px;
height: 120px;
font-family:  Georgia;
font-size: 12px;
font-weight:normal;
border-left: 3px double #e4aabe;
background-color: #343434;
text-align: justify;
padding-left: 10px;
padding-right: 10px;
margin-left:5px;
margin-top:5px;
margin-bottom:-10px;
padding-top:5px;
overflow: auto;}

.icon_cat
{
width:80px;
height: 80px;
background-color: #343434;
padding: 5px:
margin-left:5px;
margin-top:10px;
margin-bottom:-10px;
-moz-border-radius:30px 30px 30px 30px;
-webkit-border-radius:30px 30px 30px 30px;

}

.last_post{
width: 160px;
height: 120px;
margin-left: 10px;
margin-right: 10px;
margin-top: 35px;
margin-bottom: 20px;
background-color: #343434;
color:#352021;
font-family:  Georgia;
padding-top: 5px;
padding-bottom: 5px;
margin-bottom: 5px;
-moz-border-radius:30px 30px 30px 30px;
-webkit-border-radius:30px 30px 30px 30px;
}

.topic_poste
{margin-top:8px;}

.topic_post{
border-top: 3px solid #292828;
margin-top:5px;
padding-top:5px;
}

a.forumlink:link, a.forumlink:visited {
font-size: 24px;
font-family: Times New Roman;
text-align : right ;
color: #1F6AED;
font-size: 24px;
letter-spacing: -3px;
padding-left: 0px;
padding-right: 3px;
padding-bottom: 0px;
padding-top: 3px;
margin-bottom: -10px;
margin-right:40px;
display: block;
text-transform: uppercase;
text-shadow: 1px 1px 1px #000000;
font-weight:normal;
}

a.forumlink:hover, a.forumlink:hover:visited {
color: #3B7FF5;
display: block;
}


P.A :

Code:

<link type="text/css" rel="stylesheet" href="http://fonts.googleapis.com/css?family=Exo+2" />
<div id="pa">
 
<!--                    colonne de gauche                    -->
<div id="colonne1">
 
<!--                    distribution                    -->
<div class="cadre1">
 
<div class="titre">
 Distributions
</div><br />Distribution de Prismillon motif Pokéball au Pokémon Center de Paris du 4 au 21 juin.
</div>
 
<div class="fond1">
 
</div>
 
<!--                    Top Site                    -->
<div class="cadre2">
 
<div class="titre">
 TopSites
</div>
 <br /><br />
<center>
 <a href="http://top-site.pokemon-power.fr/" class="postlink" target="_blank" rel="nofollow"><img src="http://top-site.pokemon-power.fr/img/theme/v2/default.gif" alt="" border="0" /></a>
</center>
 
</div>
 
<div class="fond2">
 
</div>
 
</div>
 
<!--                    Colonne de droite                    -->
<div id="colonne2">
 
<!--                    image changeable                    -->
<div class="cadre3">
 <img style="width:180px;" src="http://www.renders-graphiques.fr/image/upload/normal/pokmon_starter_1G.png" />
</div>
 
<!--                    news                    -->
<div class="cadre4">
 
<div class="titre">
 News
</div>
 "22/01/14 - Sortie de la Banque Pokémon au Japon" <br /> "04/02/14 - Sortie de la Banque Pokémon en Europe"<br />"7/05/14 - Annonce : Pokémon Rubis Oméga et Saphir Alpha"<br />
</div>
 
<div class="fond4">
 
</div>
 
</div>
 
<!--                    colonne du milieu                    -->
<div id="centre">
 
<!--                    bienvenue                    -->
<div class="cadre5">
 
<div class="titre">
 Bienvenue sur Pokesurfia, {USER&amp;#8288;NAME}!
</div><br /> "Pokesurfia est un forum dédié à l'univers Pokémon (jeux vidéos et série) axé sur la stratégie Pokémon (avec des fiches stratégiques et des tutoriels pour les débutants) et la chasse de Pokémons chromatiques. Le forum organise à de nombreuses occasions des distributions de Pokémons ainsi que des évènements. P.A réalisée par <a href="http://templactif.forumgratuit.org/">Lapinou</a>.
</div>
 
<div class="fond5">
 
</div>
 <br />
<div class="cadre6">
 
<!--                    staff                    -->
<div class="titre">
 Staff
</div><br />
<div class="staff">
 
<!--                    infobull                    -->
<div class="transition-NU1">
 <img alt="" src="http://r21.imgfast.net/users/2111/10/48/02/avatars/1-91.jpg" style="border-radius: 100px; width: 75px; height: 75px;" />
<div class="NU_transition1">
 <span><img alt="" src="http://r21.imgfast.net/users/2111/10/48/02/avatars/1-91.jpg" style="height: 120px;" /><br />Druido (Fondateur)<br /><a href="http://pokesurfia.forumactif.com/u1">Profil</a> <a href="http://pokesurfia.forumactif.com/privmsg?mode=post&u=1">MP</a></span>
</div>
 
</div>
 
<div class="transition-NU1">
 <img alt="" src="http://img11.hostingpics.net/pics/119807avatarcoleverreskypegalerie.png" style="border-radius: 50px; width: 75px; height: 75px;" />
<div class="NU_transition1">
 <span><img alt="" src="http://img11.hostingpics.net/pics/119807avatarcoleverreskypegalerie.png" style="height: 120px;" /><br />Coleverre (Administrateur)<br /><a href="">Profil</a> <a href="http://pokesurfia.forumactif.com/u27">MP</a></span>
</div>
 
</div>
 
</div>
 
<div class="staff">
 
<div class="transition-NU1">
 <img alt="" src="http://r21.imgfast.net/users/2111/10/48/02/avatars/5-7.jpg" style="border-radius: 50px; width: 75px; height: 75px;" />
<div class="NU_transition1">
 <span><img alt="" src="http://r21.imgfast.net/users/2111/10/48/02/avatars/5-7.jpg" style="height: 120px;" /><br />Atsuyas (Modérateur)<br /><a href="http://pokesurfia.forumactif.com/u5">Profil</a> <a href="http://pokesurfia.forumactif.com/privmsg?mode=post&u=5">MP</a></span>
</div>
 
</div>
 
<div class="transition-NU1">
 <img alt="" src="http://julielavie.files.wordpress.com/2013/05/cactus-01.jpg" style="border-radius: 50px; width: 75px; height: 75px;" />
<div class="NU_transition1">
 <span><img alt="" src="http://julielavie.files.wordpress.com/2013/05/cactus-01.jpg" style="height: 120px;width:120px;" /><br />Scrat_91 (Modérateur)<br /><a href="http://pokesurfia.forumactif.com/u36">Profil</a> <a href="http://pokesurfia.forumactif.com/privmsg?mode=post&u=36">MP</a></span>
</div>
 
</div>
 
<div class="transition-NU1">
 <img alt="" src="http://r21.imgfast.net/users/2111/10/48/02/avatars/45-36.jpg" style="border-radius: 50px; width: 75px; height: 75px;" />
<div class="NU_transition1">
 <span><img alt="" src="http://r21.imgfast.net/users/2111/10/48/02/avatars/45-36.jpg" style="height: 120px;width:120px;" /><br />Kind'Heart (Modérateur) <br /><a href="http://pokesurfia.forumactif.com/u45">Profil</a> <a href="http://pokesurfia.forumactif.com/privmsg?mode=post&u=45">MP</a></span>
</div>
 
</div>
 
</div>
 
</div>
 
<div class="fond6">
 
</div>
 
</div>
 
<!--                    Partenaire                    -->
<div id="pied">
 
<div class="titre">
 Partenaires
</div>
 
<!--                    si probleme supprimer les guillement a onmouseover et onmouseout                    --> <br /> <marquee onmouseover="this.stop()" onmouseout="this.start()" loop="infinite" scrolldelay="30" scrollamount="5" direction="left"><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a> <br /> <a href=""><img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""></a></marquee>
</div>
 
</div>

Merci d'avance pour votre aide.

[Druido]

Up !

[Arias]

Si tu ne veux pas qu'il y ai d'effet de transparence dans ta PA, il te suffit de supprimer les lignes "opacity:0.4;" dans ton CSS.

Quel effet exactement souhaites tu obtenir?

[Druido]

En fait, certaines cases de la P.A sont transparentes et d'autres sont foncées, et j'aimerais faire en sorte que celles qui sont foncées deviennent transparentes (celles de gauche et celle d'en bas) et que les liens marchent sur toutes la cases.

Edit : j'ai corrigé la transparence des cases sauf une seule que je n'arrive pas à modifier (le .fondpied et le div #pied), mais maintenant aucun lien ne marche sur les cases :s

[Lixyr]

Bonjour,

Pour les cases fondpied, vous parlez desquelles ? Donnez-nous les titres des cases plutôt. Chez moi tout semble bien, et les liens fonctionnent.

[Druido]

Je parle de cette partie du code :

Code:

    div #pied{
      width:890px;
      height:150px;
   
      background-image:url("http://imageshack.us/a/img689/4726/gqab.jpg");
      background-size:100% 100%;
      border:5px solid #b45443; 
  border-radius:15px;
  opacity:0.5;
      margin-top:5px;
   
    }

    .fondpied
    {
   
    }

Sinon, je n'arrive pas à comprendre pourquoi les liens ne marchent toujours pas.

[Scoubifitz]

bonsoir,

le problème principal est que vous collez un fond-image pardessus le cadre principal , et que vous le rendez opaque ...

tout ce qui se trouve sous le fond-image ne peut plus être cliqué ...

La solution serait plutôt de mettre un cadre avec le fond-image , puis un cadre avec un fond-couleur semi-transparent pardessus , et de placer tout le contenu dans ce cadre là .

Code HTML :

Code:

<link type="text/css" rel="stylesheet" href="http://fonts.googleapis.com/css?family=Exo+2" />
<div id="pa">

<!-- colonne de gauche -->
<div id="colonne1">

<!-- distribution -->
<div class="cadre1 aspect">
<div class="fond1 opac">
<div class="titre">Distributions</div>
  <p>Distribution de Prismillon motif Pokéball au Pokémon Center de Paris du 4 au 21 juin.</p>
</div>
</div>

<!-- Top Site -->
<div class="cadre2 aspect">
<div class="fond2 opac">
<div class="titre">TopSites</div>
<p>
<a href="http://top-site.pokemon-power.fr/" class="postlink" target="_blank" rel="nofollow"><img src="http://top-site.pokemon-power.fr/img/theme/v2/default.gif" alt="" border="0" /></a>
<a href="http://top-site.pokemon-power.fr/" class="postlink" target="_blank" rel="nofollow"><img src="http://top-site.pokemon-power.fr/img/theme/v2/default.gif" alt="" border="0" /></a></p>

</div>
</div>
<!-- fin colonne de gauche -->
</div>

<!-- Colonne de droite -->
<div id="colonne2">

<!-- image changeable -->
<div class="cadre3">
<img  src="http://www.renders-graphiques.fr/image/upload/normal/pokmon_starter_1G.png" />
</div>

<!-- news -->
<div class="cadre4 aspect">
<div class="fond4 opac">
<div class="titre">News</div>
"22/01/14 - Sortie de la Banque Pokémon au Japon" <br /> "04/02/14 - Sortie de la Banque Pokémon en Europe"<br />"7/05/14 - Annonce : Pokémon Rubis Oméga et Saphir Alpha"<br />
</div>
</div>
<!-- fin colonne de droite -->
</div>

<!-- colonne du milieu -->
<div id="centre">

<!-- bienvenue -->
<div class="cadre5 aspect">
<div class="fond5 opac">
<div class="titre">
Bienvenue sur Pokesurfia, {USER&amp;#8288;NAME}!
</div><p>"Pokesurfia est un forum dédié à l'univers Pokémon (jeux vidéos et série) axé sur la stratégie Pokémon (avec des fiches stratégiques et des tutoriels pour les débutants) et la chasse de Pokémons chromatiques. Le forum organise à de nombreuses occasions des distributions de Pokémons ainsi que des évènements. P.A réalisée par <a href="http://templactif.forumgratuit.org/">Lapinou</a>.</p>
</div>
</div>

<div class="cadre6 aspect">
<div class="fond6 opac">

<!-- staff -->
<div class="titre">Staff</div>
 
<div class="staff">

<!-- infobulle -->
<div class="transition-NU1">
<img alt="" src="http://r21.imgfast.net/users/2111/10/48/02/avatars/1-91.jpg" style="border-radius: 100px; width: 75px; height: 75px;" />
<div class="NU_transition1">
<span><img alt="" src="http://r21.imgfast.net/users/2111/10/48/02/avatars/1-91.jpg" style="height: 120px;" /><br />Druido (Fondateur)<br /><a href="http://pokesurfia.forumactif.com/u1">Profil</a> <a href="http://pokesurfia.forumactif.com/privmsg?mode=post&u=1">MP</a></span>
</div>
</div>

<div class="transition-NU1">
<img alt="" src="http://img11.hostingpics.net/pics/119807avatarcoleverreskypegalerie.png" style="border-radius: 50px; width: 75px; height: 75px;" />
<div class="NU_transition1">
<span><img alt="" src="http://img11.hostingpics.net/pics/119807avatarcoleverreskypegalerie.png" style="height: 120px;" /><br />Coleverre (Administrateur)<br /><a href="">Profil</a> <a href="http://pokesurfia.forumactif.com/u27">MP</a></span>
</div>
</div>

</div>

<div class="staff">

<div class="transition-NU1">
<img alt="" src="http://r21.imgfast.net/users/2111/10/48/02/avatars/5-7.jpg" style="border-radius: 50px; width: 75px; height: 75px;" />
<div class="NU_transition1">
<span><img alt="" src="http://r21.imgfast.net/users/2111/10/48/02/avatars/5-7.jpg" style="height: 120px;" /><br />Atsuyas (Modérateur)<br /><a href="http://pokesurfia.forumactif.com/u5">Profil</a> <a href="http://pokesurfia.forumactif.com/privmsg?mode=post&u=5">MP</a></span>
</div>
</div>

<div class="transition-NU1">
<img alt="" src="http://julielavie.files.wordpress.com/2013/05/cactus-01.jpg" style="border-radius: 50px; width: 75px; height: 75px;" />
<div class="NU_transition1">
<span><img alt="" src="http://julielavie.files.wordpress.com/2013/05/cactus-01.jpg" style="height: 120px;width:120px;" /><br />Scrat_91 (Modérateur)<br /><a href="http://pokesurfia.forumactif.com/u36">Profil</a> <a href="http://pokesurfia.forumactif.com/privmsg?mode=post&u=36">MP</a></span>
</div>
</div>

<div class="transition-NU1">
<img alt="" src="http://r21.imgfast.net/users/2111/10/48/02/avatars/45-36.jpg" style="border-radius: 50px; width: 75px; height: 75px;" />
<div class="NU_transition1">
<span><img alt="" src="http://r21.imgfast.net/users/2111/10/48/02/avatars/45-36.jpg" style="height: 120px;width:120px;" /><br />Kind'Heart (Modérateur) <br /><a href="http://pokesurfia.forumactif.com/u45">Profil</a> <a href="http://pokesurfia.forumactif.com/privmsg?mode=post&u=45">MP</a></span>
</div>
</div>

</div>

</div>
</div>

<!-- Partenaire -->
<div class="pied aspect">
<div class="fondpied opac">

<div class="titre">Partenaires</div>

<!-- si probleme supprimer les guillement a onmouseover et onmouseout --> <br /> <marquee onmouseover="this.stop()" onmouseout="this.start()" loop="infinite" scrolldelay="30" scrollamount="5" direction="left"><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a> <br /> <a href=""><img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""> <img src="http://www.pixenli.com/images/1333299771090169300.png" /></a><a href=""></a></marquee>
</div>

</div>

Code CSS :

Code:

/* Enlever fond derrière la P.A*/

table#msg_et, table#msg_et td{
background-color:none !important;
}
/* Image de Fond Chatbox */
body.chatbox{
background-image:url(http://elblogdeljugon.com/wp-content/uploads/2013/12/pokemon_x_and_y_wallpaper_by_redash2025-d68st9v-1024x576.jpg);
}

.chatbox_row_1,.chatbox_row_2,.chatbox_row_3 {
background: none;
}


.tstaff{font-size:1em;}

.thumbnail{position: relative;z-index: 0;}

.thumbnail:hover{background-color: transparent;z-index: 50;}

.thumbnail span{
position: absolute;
background-color: #2B2B2B;
padding: 5px;
left: -1000px;
visibility: hidden;
color: #DEDEDE;}

.thumbnail span img{border: 1px groove;padding: 2px;}

.thumbnail:hover span{
visibility: visible;
top: 20px;
left: 15px;
width: 150px;}
/* Accueil fond transparent */

.bodyline {
background-color:transparent;
background-image:url('http://img15.hostingpics.net/pics/198623fondtransparent.png');
}

.bodyline{
border-radius: 20px;
}
/* Contours Image de profil */
.postdetails.poster-profile a img
{
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
border-left: 5px solid  #2461C9;
border-right: 5px solid  #2461C9;
}

#essaye, .forumline {
background: none!important;
}

/* P.A by Lapinou */
/* cadre principal */

div#pa
{
width:900px;
background:#423B3B;
border:5px solid #586ea9;
border-radius:15px;
padding:25px;
font-family: 'Exo 2', sans-serif;
color:#000;
font-size:11px;
text-align:center;
}

/* aspect des cadres - du titre - des liens */

div .aspect
{
border:5px solid #b45443;
border-radius:15px;
overflow:auto;
}
div .opac
{
background:rgba(255,255,255,0.6);
padding:5px;
}
.titre
{
font-size:25px;
font-family: 'Exo 2', sans-serif;
text-align:center;
text-transform:uppercase;
font-weight:bold;
font-style:italic;
color:#406BA4;
}
#pa a
{
text-decoration: none;
color: black;
}

/* colonne de gauche */

div #colonne1
{
float: left;
width:240px;
margin-right: 10px;
}

/* cadre du haut */

div #colonne1 .cadre1
{
height:350px;
background:url("http://imageshack.us/a/img849/8383/h7ze.jpg") center;
background-size:200% 100%;
}
div #colonne1 .fond1
{
  height:340px; /* 10px de moins que le cadre */
}

/* cadre du bas */

div #colonne1 .cadre2
{
  height:200px;
  margin-top:10px;
  background-image:url("http://umi-no-hoshi.u.m.pic.centerblog.net/535a0854.jpg");
  background-size:100% 100%;
}
div #colonne1 .fond2
{
  height:190px; /* 10px de moins que le cadre */
}
/* position des topsites */
div #colonne1 .fond2 a
{
  display:block;
  padding:1px;
}

/* colonne de droite */

div #colonne2
{
float: right;
width: 220px;
margin-left: 10px;
}

div #colonne2 .cadre3 img
{
height:120px;
}

div #colonne2 .cadre4
{
height:450px;
background:url("http://imagizer.imageshack.us/a/img843/1513/y0kt.jpg") center;
background-size:150% 100%;
}
div #colonne2 .fond4
{
height:440px; /* 10px de moins que le cadre */
}

/* colonne du milieu */

div #centre
{
width:100%;
}

div #centre .cadre5
{
height:280px;
text-align:justify;
background:url("http://imageshack.us/a/img822/3827/dczb.png");
background-size:100% 100%;
}
div #centre .fond5
{
height:270px; /* 10px de moins que le cadre */
}

div #centre .cadre6{
height:270px;
background:url("http://imageshack.us/a/img818/7083/2yul.png");
background-size:100% 100%;
margin-top: 10px;
}
div #centre .fond6
{
height:260px; /* 10px de moins que le cadre */
}

.staff
{
width:300px;
height:5px;
margin-left:50px;
text-align:center;
}

.transition-NU1
{
position: relative;
width: 75px;
height:75px;
float: left;
margin: 5px;
padding: 0;
border-radius:50px;
padding-top:10px;
}
/* INFOBULLE */
.NU_transition1
{
background:#423B3B;
text-align:justify;
width: 0;
height: 0;
margin-top:-60px;
margin-left:-50px;
overflow: hidden;
position: absolute;
left:20px;
top: 20;
z-index: 999;
padding: 0;
text-align: center;
-webkit-transition: width 0.8s ease-in 0.2s, height 0.8s ease-in 0.2s, padding 0.8s ease-in 0.2s; /* pour navigateur webkit */
-moz-transition: width 0.8s ease-in 0.2s, height 0.8s ease-in 0.2s, padding 0.8s ease-in 0.2s; /* pour navigateur mozilla */
-o-transition: width 0.8s ease-in 0.2s, height 0.8s ease-in 0.2s, padding 0.8s ease-in 0.2s; /* pour navigateur opera */
transition: width 0.8s ease-in 0.2s, height 0.8s ease-in 0.2s, padding 0.8s ease-in 0.2s; /* pour les navigateurs récents */
}
/* INFOBULLE AU SURVOL */
.transition-NU1:hover .NU_transition1
{
height: 150px;
width: 150px;
padding: 0px;
border-width: 1px;
border:1px solid #586ea9 ;
background:#423B3B;
padding-top:10px;
}
/* IMAGE (icône) */
.transition-NU1 img
{
position: relative;
border-radius:7px;
z-index: 990;
left: 0;
bottom: 0;
box-shadow: 0px 0px 5px #c1b4ba;
-webkit-transition: all 1s linear 0s;/* pour navigateur webkit */
-moz-transition: all 1s linear 0s; /* pour navigateur mozilla */
-o-transition: all 1s linear 0s;/* pour navigateur opera */
transition: all 1s linear 0s; /* pour les navigateurs récents */
}
/* IMAGE (icône) AU SURVOL */
.transition-NU1:hover img
{
-webkit-transition: rotate(360deg);/* pour navigateur webkit */
-moz-transform: rotate(360deg); /* pour navigateur mozilla */
-o-transform: rotate(360deg);/* pour navigateur opera */
transform: rotate(360deg); /* pour les navigateurs récents */
}

div .pied
{
height:150px;
background:url("http://imageshack.us/a/img689/4726/gqab.jpg") center;
background-size:100% 200%;
margin-top:10px;
}
div .fondpied
{
height:140px; /* 10px de moins que le cadre */
}

/* ********** CATEGORIE ********** */

#descripti{
width:540px;
height: 150px;
font-family:  Georgia;
font-size: 12px;
background-color: #343434;
text-align: justify;
padding-left: 30px;
padding-right: 10px;
margin-bottom: 10px;
margin-top:6px;
-moz-border-radius:40px 40px 0px 0px;
-webkit-border-radius:40px 40px 0px 0px;
background-image: url(http://img4.hostingpics.net/pics/585758test12.png);
}

.lienss
{
width:570px;
height: 30px;
Border-top: 3px double #1F6AED;
font-weight:  normal;
font-family:Georgia;
font-size: 10px;
padding-left:10px;
margin-top:-20px;
padding-top:10px;
background-color: #343434;
-moz-border-radius:0px 0px 40px 40px;
-webkit-border-radius:0px 0px 40px 40px;}

.descriptiion{
width:410px;
height: 120px;
font-family:  Georgia;
font-size: 12px;
font-weight:normal;
border-left: 3px double #e4aabe;
background-color: #343434;
text-align: justify;
padding-left: 10px;
padding-right: 10px;
margin-left:5px;
margin-top:5px;
margin-bottom:-10px;
padding-top:5px;
overflow: auto;}

.icon_cat
{
width:80px;
height: 80px;
background-color: #343434;
padding: 5px:
margin-left:5px;
margin-top:10px;
margin-bottom:-10px;
-moz-border-radius:30px 30px 30px 30px;
-webkit-border-radius:30px 30px 30px 30px;
}

.last_post{
width: 160px;
height: 120px;
margin-left: 10px;
margin-right: 10px;
margin-top: 35px;
margin-bottom: 20px;
background-color: #343434;
color:#352021;
font-family:  Georgia;
padding-top: 5px;
padding-bottom: 5px;
margin-bottom: 5px;
-moz-border-radius:30px 30px 30px 30px;
-webkit-border-radius:30px 30px 30px 30px;
}

.topic_poste
{margin-top:8px;}

.topic_post{
border-top: 3px solid #292828;
margin-top:5px;
padding-top:5px;
}

a.forumlink:link, a.forumlink:visited {
font-size: 24px;
font-family: Times New Roman;
text-align : right ;
color: #1F6AED;
font-size: 24px;
letter-spacing: -3px;
padding-left: 0px;
padding-right: 3px;
padding-bottom: 0px;
padding-top: 3px;
margin-bottom: -10px;
margin-right:40px;
display: block;
text-transform: uppercase;
text-shadow: 1px 1px 1px #000000;
font-weight:normal;
}

a.forumlink:hover, a.forumlink:hover:visited {
color: #3B7FF5;
display: block;
}


[Druido]

Merci, Scoubifitz ! Ça marche parfaitement désormais ! Par contre les liens sont en noir donc c'est assez dur de les dissocier dans le texte mais merci beaucoup

[Scoubifitz]

recherchez dans le CSS ceci :

/* aspect des cadres - du titre - des liens */

div .aspect
{
border:5px solid #b45443;
border-radius:15px;
overflow:auto;
}
div .opac
{
background:rgba(255,255,255,0.6);
padding:5px;
}
.titre
{
font-size:25px;
font-family: 'Exo 2', sans-serif;
text-align:center;
text-transform:uppercase;
font-weight:bold;
font-style:italic;
color:#406BA4;
}
#pa a
{
text-decoration: none;
color: black;
}

et changez la couleur ....

[Druido]

Merci ! ^^