Je n'arrives pas à changer le fond de ma PA et l'infobulle ne va plus

[MelissaD]

Bonjour,

Comme dit le titre de mon sujet, j'ai un petit problème avec mon message d'accueil (la PA).
Je n'arrive pas du tout à changer la couleur de fond des titres du messages d'accueil, et depuis que j'ai mis l'actualité du forum, je ne vois plus les infobulles (elles ne s'affichent plus au passage de la souris).

Pourriez-vous m'aider svp ? Voici le forum (j'ai mis sur un forum test pour ne pas faire de pub)
http://test-forum.sos-forum.net/


Mon css :

Code:

/******************* PA******************************/
.titre {
text-align: center;
padding-top: 1%;
font-size: 16px;
font-style: oblique;
}

.fond {
background-color: #3D3428;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
vertical-align: top;
}

.lienpa {
border-left: 10px solid #999999;
border-right: 10px solid #999999;
-moz-border-radius-topleft: 10px;
-webkit-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
-webkit-border-radius-topright: 10px;
background-color: #3D3428;
text-align: center;
}

a.imginfo {  /* INFOBULLES */
  position: relative;
  color: #7d7d7d; /* couleur de votre texte */
  text-decoration: none;
  border-bottom: 0px #7d7d7d solid; /* on souligne le texte */
}

a.imginfo span {
  display: none; /* on masque l'infobulle */
}
a.imginfo:hover {
  background: none; /* correction d'un bug IE */
  z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
  cursor: help; /* on change le curseur par défaut en curseur d'aide */
}
a.imginfo:hover span {
  display: inline; /* on affiche l'infobulle */
  position: absolute;
  white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
  top: 10px; /* on positionne notre infobulle */
  left: 20px;
  background: #3D3428;
  color: #3D3428;
  padding: 3px;
  border: 0px solid #3D3428;
  border-left: 5px solid #3D3428; /* vos couleurs et taille de bordures */
  border-right: 3px solid #3D3428;
  border-top: 3px solid #3D3428;
  border-bottom: 5px solid #3D3428;
}



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


.bodyline{ -moz-border-radius: 20px;}




.accueil-ul{
overflow: hidden;
width: auto;
margin: 0;
padding: 0;
list-style-type: none;
}
.accueil-li{
  float: left;
  margin-left:6px;
  padding-left:8px;
  padding-right:8px;
  padding-bottom:5px;
}
.accueil-li:hover{
    margin-left:6px;
  padding-left:8px;
  padding-right:8px;
  padding-bottom:5px;
}
.accueil-contenu{
  padding-bottom:10px;
  padding-left:10px;
  padding-right:10px;
  padding-top:10px;
}




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

a
{
outline: none;
}

legend {color: #452800;}

fieldset {border-color: black;
-moz-border-radius: 5px;}

body.chatbox {
background-color: #9b9488;
}

#chatbox_header {
background-color: #9b9488;
}

.chatbox_row_1,.chatbox_row_2,.chatbox_row_3 {
background-color: #9b9488;
}

.memberlist_row_1 {
background-color: #9b9488;
}

#chatbox_members .member-title {
background-color: #9b9488;
}

Mon message d'accueil (Affichage > Page d'accueil > Généralités) :

Code:

<table border="0" width="100%" cellspacing="10">
  <tr>
      <td width="65%" colspan="2" class="fond"><div class="titre"><div style="background: #9cb4b6; -moz-border-radius: 20px;">STAFF</div></div>
        <br><div style="padding-left: 2%; padding-bottom: 2%; text-align: center;">
            <a class="imginfo"><img src="http://i44.servimg.com/u/f44/16/64/59/54/audrey10.jpg"/><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">ZACK. MCTWEEN. ; Admin </font><br/></td></tr></tbody></table></span></a>
            <a class="imginfo"><img src="http://i44.servimg.com/u/f44/16/64/59/54/ouija_10.jpg"/><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">DEAN DARELL ; Fondateur </font><br/></td></tr></tbody></table></span></a>
<a class="imginfo"><img src="http://i44.servimg.com/u/f44/16/64/59/54/moi_bm10.jpg"/><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">ELENA MORINSTAL ; Admin </font><br/></td></tr></tbody></table></span></a>
            </div>
      </td>
      <td width="35%" class="fond"><div class="titre"><div style="background: #9cb4b6; -moz-border-radius: 20px;">ACTUALITÉ</div></div>
        <br><div style="text-align: center; padding-bottom: 2%;">Bonjour à tous ! Le forum voit le jour et les sujets se multiplient.
Les catégories et forums sont entièrement terminés il ne reste désormais plus qu'à poster.
"-Mais Dean il nous faut des membres" !
Et bien oui Robert. Je suis moi-même en train de me cloner pour pouvoir assurer une publicité plus large. Non sérieusement, pensez à faire de la pub. Nous en avons besoin pour décoller.
Dès ce soir je m'en vais bombarder de demandes de partenariats les autres forums.
</div>
      </td>
  </tr>
  <tr>
      <td class="fond" width="25%"><div class="titre"><div style="background: #9cb4b6; -moz-border-radius: 20px;">LIENS</div></div>
        <br><div style="background-color: #E1E1E1; margin-left: 5%; margin-right: 5%; padding-left: 2%; padding-right: 2%;">
            <div class="lienpa"><a href="http://blackriver-rpg.forumgratuit.org/t15-rules-of-game">Rules of Game</a></div>
            <div class="lienpa"><a href="http://blackriver-rpg.forumgratuit.org/t2-l-histoire-de-blackriver">Histoire</a></div>
            <div class="lienpa"><a href="http://blackriver-rpg.forumgratuit.org/t8-explications-des-groupes">Explications des rôles</a></div>
            <div class="lienpa"><a href="http://blackriver-rpg.forumgratuit.org/t4-modele-de-presentation">Présentation</a></div></div>
      </td>
      <td class="fond" width="40%" style="padding-bottom: 2%; padding-left: 2%;"><div class="titre"><div style="background: #9cb4b6; -moz-border-radius: 20px;">CONTEXTE</div></div>
        <br><br><div style="width:250px;height:90px;overflow:auto;">
            Tout au long de votre aventure vous serez amené à choisir différentes voix pour votre personnage. Un joueur qui incarne un civil de BlackRiver au début du jeu peut très bien voir son personnage transformé en loup garou après une morsure de celui-ci rencontré dans la forêt. Réflechissez avant de fréquenter un endroit ou un lieu louche. On vous aura prévenu. Les créatures qui peuplent BlackRiver ne sont pas des bisounours ou des gentils fantômes comme notre très cher Casper. Dans cette ville vous pourrez à tout moment trouver le croque mitaine sous votre lit ou Bloody Mary derrière vous,alors que vous vous recoiffez tranquillement. Mais rappellez-vous,tout n'est pas noir ou blanc. Méfiez-vous des apparences et des belles paroles. Votre but ? Survivre. Découvrir la vérité sera peut être un luxe accordé aux survivants. Alors soyez vigilants car un collier d'ail autour de votre cou ou tapisser votre maison de crucifix n'éloignera pas toutes les entités qui rôdent. Vous êtes prêt ? Alors allons-y.</div>
      </td>
      <td class="fond"><div class="titre"><div style="background: #9cb4b6; -moz-border-radius: 20px;">LIENS ACTUALITÉ</div></div>
        <br><br><form name="MenuderoulantselonDark" method="POST" style="text-align: center;">
                  <select name="wxlmenu" size=1 style="font-family: tahoma; color: #000000; border-style: solid; border-width: thin; font-size: 11; background: #FFFFFF; width: 70%;">
                    <option selected="selected">• Blackriver •</option>
                    <option value="http://blackriver-rpg.forumgratuit.org/t20-nouveautes-du-05072011#41">• Nouveautés du 05.07.2011 •</option>
                    <option value="http://blackriver-rpg.forumgratuit.org/t16-les-fiches-personnages-identity">• Fiches de personnages •</option>
                  </select>
                  <input type="button" style="font-family: verdana; color: #00000; border-style: solid; border-width: thin; font-size: 12; background: #FFFFFF;" onClick="location =
                        document.MenuderoulantselonDark.wxlmenu.options
                        [document.MenuderoulantselonDark.wxlmenu.selectedIndex].value;"value="Go">
              </form>
      </td>
  </tr>
</table>

[MelissaD]

UP svp ?

[Invité]

Bonsoir,

Vous avez des images qui ne fonctionnent plus dans votre code:
> https://i.servimg.com/u/f44/16/64/59/54/audrey10.jpg
et
> https://i.servimg.com/u/f44/16/64/59/54/moi_bm10.jpg

Vous ne pouviez pas modifier la couleur des titres via la feuille de style, cette couleur se trouvait dans le message d'accueil, je l'ai incluse à votre CSS pour plus de facilité.

Votre message d'accueil:

Code:

<table border="0" width="100%" cellspacing="10">
  <tr>
      <td width="65%" colspan="2" class="fond"><div class="titre">STAFF</div>
        <br><div style="padding-left: 2%; padding-bottom: 2%; text-align: center;">
            <table align="center"><tr><td><div class="imginfo"><img src="http://i44.servimg.com/u/f44/16/64/59/54/audrey10.jpg"/><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">ZACK. MCTWEEN. ; Admin </font><br/></td></tr></tbody></table></span></div></td><td>
            <div class="imginfo"><img src="http://i44.servimg.com/u/f44/16/64/59/54/ouija_10.jpg"/><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">DEAN DARELL ; Fondateur </font><br/></td></tr></tbody></table></span></div></td><td><div class="imginfo"><img src="http://i44.servimg.com/u/f44/16/64/59/54/moi_bm10.jpg"/><span><table width="125" cellspacing="1" cellpadding="1" border="0"><tbody><tr><td style="text-align: center;"><font size="1">ELENA MORINSTAL ; Admin </font><br/></td></tr></tbody></table></span></div></td></tr></table>
            </div>
      </td>
      <td width="35%" class="fond"><div class="titre">ACTUALITÉ</div>
        <br><div style="text-align: center; padding-bottom: 2%;">Bonjour à tous ! Le forum voit le jour et les sujets se multiplient.
Les catégories et forums sont entièrement terminés il ne reste désormais plus qu'à poster.
"-Mais Dean il nous faut des membres" !
Et bien oui Robert. Je suis moi-même en train de me cloner pour pouvoir assurer une publicité plus large. Non sérieusement, pensez à faire de la pub. Nous en avons besoin pour décoller.
Dès ce soir je m'en vais bombarder de demandes de partenariats les autres forums.
</div>
      </td>
  </tr>
  <tr>
      <td class="fond" width="25%"><div class="titre">LIENS</div>
        <br><div style="background-color: #E1E1E1; margin-left: 5%; margin-right: 5%; padding-left: 2%; padding-right: 2%;">
            <div class="lienpa"><a href="http://blackriver-rpg.forumgratuit.org/t15-rules-of-game">Rules of Game</a></div>
            <div class="lienpa"><a href="http://blackriver-rpg.forumgratuit.org/t2-l-histoire-de-blackriver">Histoire</a></div>
            <div class="lienpa"><a href="http://blackriver-rpg.forumgratuit.org/t8-explications-des-groupes">Explications des rôles</a></div>
            <div class="lienpa"><a href="http://blackriver-rpg.forumgratuit.org/t4-modele-de-presentation">Présentation</a></div></div>
      </td>
      <td class="fond" width="40%" style="padding-bottom: 2%; padding-left: 2%;"><div class="titre">CONTEXTE</div>
        <br><br><div style="width:250px;height:90px;overflow:auto;">
            Tout au long de votre aventure vous serez amené à choisir différentes voix pour votre personnage. Un joueur qui incarne un civil de BlackRiver au début du jeu peut très bien voir son personnage transformé en loup garou après une morsure de celui-ci rencontré dans la forêt. Réflechissez avant de fréquenter un endroit ou un lieu louche. On vous aura prévenu. Les créatures qui peuplent BlackRiver ne sont pas des bisounours ou des gentils fantômes comme notre très cher Casper. Dans cette ville vous pourrez à tout moment trouver le croque mitaine sous votre lit ou Bloody Mary derrière vous,alors que vous vous recoiffez tranquillement. Mais rappellez-vous,tout n'est pas noir ou blanc. Méfiez-vous des apparences et des belles paroles. Votre but ? Survivre. Découvrir la vérité sera peut être un luxe accordé aux survivants. Alors soyez vigilants car un collier d'ail autour de votre cou ou tapisser votre maison de crucifix n'éloignera pas toutes les entités qui rôdent. Vous êtes prêt ? Alors allons-y.</div>
      </td>
      <td class="fond"><div class="titre">LIENS ACTUALITE</div>
        <br><br><form name="MenuderoulantselonDark" method="POST" style="text-align: center;">
                  <select name="wxlmenu" size=1 style="font-family: tahoma; color: #000000; border-style: solid; border-width: thin; font-size: 11; background: #FFFFFF; width: 70%;">
                    <option selected="selected">• Blackriver •</option>
                    <option value="http://blackriver-rpg.forumgratuit.org/t20-nouveautes-du-05072011#41">• Nouveautés du 05.07.2011 •</option>
                    <option value="http://blackriver-rpg.forumgratuit.org/t16-les-fiches-personnages-identity">• Fiches de personnages •</option>
                  </select>
                  <input type="button" style="font-family: verdana; color: #00000; border-style: solid; border-width: thin; font-size: 12; background: #FFFFFF;" onClick="location =
                        document.MenuderoulantselonDark.wxlmenu.options
                        [document.MenuderoulantselonDark.wxlmenu.selectedIndex].value;"value="Go">
              </form>
      </td>
  </tr>
</table>

Votre CSS:

Code:

/******************* PA******************************/
.titre {
text-align: center;
font-size: 16px;
font-style: oblique;
margin-top: 1%;
background: #9cb4b6;
-moz-border-radius: 20px;
display: block;}

.fond {
background-color: #3D3428;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
vertical-align: top;
}

.lienpa {
border-left: 10px solid #999999;
border-right: 10px solid #999999;
-moz-border-radius-topleft: 10px;
-webkit-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
-webkit-border-radius-topright: 10px;
background-color: #3D3428;
text-align: center;
}

.imginfo {  /* INFOBULLES */
  position: relative;
  color: #7d7d7d; /* couleur de votre texte */
  text-decoration: none;
  border-bottom: 0px #7d7d7d solid; /* on souligne le texte */
}

.imginfo span {
  display: none; /* on masque l'infobulle */
}
.imginfo:hover {
  background: none; /* correction d'un bug IE */
  z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
  cursor: help; /* on change le curseur par défaut en curseur d'aide */
}
.imginfo:hover span {
  display: inline; /* on affiche l'infobulle */
  position: absolute;
  white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
  top: 10px; /* on positionne notre infobulle */
  left: 20px;
  background: #3D3428;
  color: #7d7d7d;
  padding: 3px;
  border: 0px solid #3D3428;
  border-left: 5px solid #3D3428; /* vos couleurs et taille de bordures */
  border-right: 3px solid #3D3428;
  border-top: 3px solid #3D3428;
  border-bottom: 5px solid #3D3428;
}



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


.bodyline{ -moz-border-radius: 20px;}




.accueil-ul{
overflow: hidden;
width: auto;
margin: 0;
padding: 0;
list-style-type: none;
}
.accueil-li{
  float: left;
  margin-left:6px;
  padding-left:8px;
  padding-right:8px;
  padding-bottom:5px;
}
.accueil-li:hover{
    margin-left:6px;
  padding-left:8px;
  padding-right:8px;
  padding-bottom:5px;
}
.accueil-contenu{
  padding-bottom:10px;
  padding-left:10px;
  padding-right:10px;
  padding-top:10px;
}




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

a
{
outline: none;
}

legend {color: #452800;}

fieldset {border-color: black;
-moz-border-radius: 5px;}

body.chatbox {
background-color: #9b9488;
}

#chatbox_header {
background-color: #9b9488;
}

.chatbox_row_1,.chatbox_row_2,.chatbox_row_3 {
background-color: #9b9488;
}

.memberlist_row_1 {
background-color: #9b9488;
}

#chatbox_members .member-title {
background-color: #9b9488;
}

Cordialement.

[MelissaD]

Coucou,

Merci de ton aide, c'est super maintenant tout va bien ^^
Par-contre j'ai une dernière petite question ; Comment est-ce qu'on change les couleurs gris foncées et gris clairs qui sont mis à côté des liens??

Merci d'avance,
Bonne journée

[Invité]

Bonjour,

Il y a 2 éléments qui donnent les bandes grises. Le premier dans le message d'accueil:

<td class="fond" width="25%"><div class="titre">LIENS</div>
<br><div style="background-color: #E1E1E1; margin-left: 5%; margin-right: 5%; padding-left: 2%; padding-right: 2%;">
<div class="lienpa"><a href="http://blackriver-rpg.forumgratuit.org/t15-rules-of-game">Rules of Game</a></div>
<div class="lienpa"><a href="http://blackriver-rpg.forumgratuit.org/t2-l-histoire-de-blackriver">Histoire</a></div>
<div class="lienpa"><a href="http://blackriver-rpg.forumgratuit.org/t8-explications-des-groupes">Explications des rôles</a></div>
<div class="lienpa"><a href="http://blackriver-rpg.forumgratuit.org/t4-modele-de-presentation">Présentation</a></div></div>
</td>

Le second dans la feuille CSS:

.lienpa {
border-left: 10px solid #999999;
border-right: 10px solid #999999;
-moz-border-radius-topleft: 10px;
-webkit-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
-webkit-border-radius-topright: 10px;
background-color: #3D3428;
text-align: center;
}

Modifiez les couleurs ou supprimez-les.

Cordialement.

[MelissaD]

Merci beaucoup

Sujet résolu