[Problème] Titre des sujets Bouton_active[Problème] Titre des sujets Bouton_hover[Problème] Titre des sujets Fb-hover[Problème] Titre des sujets Fb-active
CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur:

Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus!

Derniers sujets
» Fiche de Présentation RPG
[Problème] Titre des sujets EmptySam 30 Mar 2024, 22:07 par Peyton972

» [RPG] Fiche personnage avec bannière
[Problème] Titre des sujets EmptySam 30 Mar 2024, 22:06 par Peyton972

» Structure de Qui Est En Ligne (1)
[Problème] Titre des sujets EmptyLun 04 Mar 2024, 23:20 par Peyton972

» Qui Est En Ligne - Utopia
[Problème] Titre des sujets EmptyDim 24 Déc 2023, 18:16 par romee

» Pack forum complet "Androïd Sylver" RPU (N°2)
[Problème] Titre des sujets EmptyJeu 02 Nov 2023, 06:42 par Hydrar

» Formulaire de connexion rapide amélioré
[Problème] Titre des sujets EmptySam 04 Mar 2023, 18:57 par Krager

» Avatar centré dans le profil
[Problème] Titre des sujets EmptySam 11 Fév 2023, 06:04 par Krager

» Vos partenaires dans le footer
[Problème] Titre des sujets EmptyMar 07 Fév 2023, 08:40 par Oxtran

Le Deal du moment :
Cartes Pokémon 151 : où trouver le ...
Voir le deal

Partagez
 

[Problème] Titre des sujets

Voir le sujet précédent Voir le sujet suivant Aller en bas 
Kâ Lys
Kâ Lys
{ Membre }
{ Membre }

Masculin Messages : 43



[Problème] Titre des sujets Empty
J'ai un petit problème quant aux titres de mes sujets sur mon forum. Voici un lien qui vous mènera directement dans une section où il y a plusieurs sujets. Vous remarquerez qu'un titre sur deux s'anime au passage de la souris et... ça m'énerve! C'est juste ICI!

Puisque je sais que le problème est sans doute relié à mon CSS, je vais vous l'exposer :

Code:
/*Fiche PV personnalisées par Orange*/
/* ------------- FICHE PV-RPG
Créee par Orange de CSSActif (http://www.css-actif.com)
Merci de conserver cette mention par respect ----------- */
.cssactif_fiche, .cssactif_pv { /* Fond de la fiche */
  background-color: #1D1D1D; /* Couleur de fond */
 
 
  -webkit-border-radius: 20px; /* Bordures arrondies (voir: http://border-radius.com/) */
  -moz-border-radius: 20px;/* Bordures arrondies (voir: http://border-radius.com/) */
  border-radius: 20px;/* Bordures arrondies (voir: http://border-radius.com/) */
 
  -webkit-box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */
-moz-box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */
box-shadow: 0px 0px 10px 0px #000000;  /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */
     
}

div.cssactif_fiche_header { /* En-tête avec image de fond */
  background-repeat: none; /* Empêche la répétition de l'image du header */
  background-position: top center; /* Postionne l'image du header en haut, au center */

 
  height: 150px; /* Donne la hauteur en px du header, l'image de header devrait être même hauteur ou plus grande */
 
  border-bottom: 15px double #921628; /* Bordure au bas du header: ÉPAISSEURpx STYLE #COULEUR (voir: http://www.css-actif.com/t66-css-cours-elementaire-1-le-groupement#border-style)  */
 
 
  /* Bordures  supérieures arrondies (voir: http://border-radius.com/) */
  -webkit-border-top-left-radius: 20px;
-webkit-border-top-right-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-topright: 20px;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
 
}

td.cssactif_pv_header { /* En-tête avec image de fond */
  background-repeat: no-repeat; /* Empêche la répétition de l'image du header */
  background-position: top center; /* Postionne l'image du header en haut, au center */

  width: 200px; /* Donne la largeur de la bannière latérale (Largeur de l'avatar) */
  height: 320px; /* Donne la hauteur en px du header, l'image de header devrait être même hauteur ou plus grande (Hauteur de l'avatar) */
 
  border-right: 15px double #921628; /* Bordure côté du header: ÉPAISSEURpx STYLE #COULEUR (voir: http://www.css-actif.com/t66-css-cours-elementaire-1-le-groupement#border-style)  */
 
 
  /* Bordures  gauche arrondies (voir: http://border-radius.com/) */
  -webkit-border-top-left-radius: 20px;
-webkit-border-bottom-left-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomleft: 20px;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
 
 
  text-shadow: 1px 1px 0px #000; /* Ombre du texte */
  font-size: 10px; /* Taille du texte: TAILLEpx */
}

div.cssactif_pv_titre h1, div.cssactif_fiche_titre h1 { /* Titre prénoms & nom */

font-family: Georgia, "Times New Roman", Times, serif; /*Police du titre (voir: http://www.css-actif.com/t66-css-cours-elementaire-1-le-groupement#forme_caracteres) */

  font-size: 32px; /* Taille du texte: TAILLEpx */
 
  text-shadow: 1px 1px 0px #000; /* Ombre du texte */
 
  color: #d51731; /* Couleur du texte */
 
  margin: 0; /* Supprime la marge par défaut de l'élément h1 */
 
  text-align: right;  /* Aligne le titre à droite */
  text-transform: uppercase; /* Met le titre en majuscules */
 
}

div.cssactif_fiche_titre, div.cssactif_pv_titre { /* Titre + feat */
  /* Positionne le titre "à cheval" sur la bordure */
  position: relative;
  top: -28px;
 

  text-align: right;      /* Aligne le texte à droite */
 

  padding-right: 20px;    /* Défifine une marge interne */
  color: #CCCCCC; /* Couleur du feat */
}

.cssactif_pv h2, div.cssactif_fiche h2 { /* Sous-titres "Identité", "Opinions" etc. */
 background-color: #111111;  /* Couleur du fond des sous-titres */
 border-color: #6a0e1b; /* Couleur de la bordure */
 border-width: 1px 0px; /* Taille de la bordure: HAUT & BAS  GAUCHE & DROITE */
 border-style: solid; /* Style de la bordure */
 
    -webkit-box-shadow: 0px 0px 3px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */
-moz-box-shadow: 0px 0px 3px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */
box-shadow: 0px 0px 3px 0px #000000;  /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */

  text-align: center;  /* Aligne le titre au centre */
  text-transform: uppercase; /* Met le titre en majuscules */
  font-family: Georgia, "Times New Roman", Times, serif; /*Police du titre (voir: http://www.css-actif.com/t66-css-cours-elementaire-1-le-groupement#forme_caracteres) */
  color: #921628;  /* Couleur du titre */
  margin: 0; /* Supprimer marge */
  font-size: 20px; /* TAILLE DU TEXTE: TAILLEpx */
  font-weight: normal; /*Épaisseur du texte */
  text-shadow: 1px 1px 0px #000; /*Ombre du texte */
  letter-spacing: 5px; /* Espacement des caractères */
 
}

.cssactif_pv_content, .cssactif_fiche_content { /* Contenu */
 padding: 10px; /* Marge interne */
 text-align: justify; /* Justifie le texte */
 text-shadow: 1px 1px 0px #000; /*Ombre du texte */
}

.cssactif_pv em, .cssactif_fiche em { /* Libellés */
  font-family: Georgia, "Times New Roman", Times, serif; /*Police du titre (voir: http://www.css-actif.com/t66-css-cours-elementaire-1-le-groupement#forme_caracteres) */
  color: #921628;  /* Couleur du titre */
  font-style: normal;
  text-transform: uppercase;
 
}


div.infobulle {
  position: relative;
  cursor:pointer; /*donne au curseur la forme de petite main, comme sur un lien*/
  display: inline-block; /*Place les icones un à côté de l'autre */
  margin: 10px; /* marge entre les icones */
  border: 1px solid #333; /* bordure des icones */
 
  -webkit-box-shadow: 0px 0px 5px 0px #000000; /* Ombre de l'icone (voir http://css3generator.com/ choix "Box-shadow") */
-moz-box-shadow: 0px 0px 5px 0px #000000; /* Ombre de l'icone  (voir http://css3generator.com/ choix "Box-shadow") */
box-shadow: 0px 0px 5px 0px #000000;  /* Ombre de l'icone  (voir http://css3generator.com/ choix "Box-shadow") */

}

div.infobulle img {
 height: 50px;
 width: 50px; 
}

div.infobulle div{
  display: none; /* ceci masque l'infobulle */
}
div.infobulle:hover {
  background: none; /* correction d'un bug IE */
  z-index: 500; /* on définit une valeur pour l'ordre d'affichage */

}
div.infobulle:hover div{
  display: block; /* ceci affiche l'infobulle */
  position: absolute;

  width: 300px; /* Largeur de l'infobulle */

  top: 50px; /* on positionne notre infobulle */
  left: 0px;

  background-color: #1D1D1D; /* Couleur de fond */
 
 
  -webkit-border-radius: 20px; /* Bordures arrondies (voir: http://border-radius.com/) */
  -moz-border-radius: 20px;/* Bordures arrondies (voir: http://border-radius.com/) */
  border-radius: 20px;/* Bordures arrondies (voir: http://border-radius.com/) */
 
  -webkit-box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */
-moz-box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */
box-shadow: 0px 0px 10px 0px #000000;  /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */
      border-left: 6px double #921628;
      padding: 10px; /* marge interne de l'infobulle */
}
/* ------------- FIN FICHE PV-RPG */

/*Textes du forum justifiés*/
.postbody, td.row1 span.gensmall {
text-align: justify !important;
display: block;
}

/*Rotation d'une image au survol*/
.img3 {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
}
.img3:hover {
    -webkit-transform: rotate(20deg);
    -moz-transform: rotate(20deg);
    -o-transform: rotate(20deg);
}

/*Enlever la mention «Dernière modification par X»*/
tr.post span.gensmall { display: none; }

/*Contour autour de l'avatar*/
.postdetails.poster-profile a img {
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
border: 5px solid none;
}

/*Transformation des liens*/
.test2:hover {text-shadow:1px 1px 2px #FF0000;}

/*Effet pour le titre des catégories - Liens Non-Survolés*/
a.forumlink:link, a.forumlink:visited {
font-family: georgia;
text-transform : uppercase;
text-align: center;
font-size: 100%;
border-bottom: 5px solid #couleur;
color: #couleur;
letter-spacing: 1px;
display: block;
-moz-border-radius:10px;
}

/*Effet pour le titre des catégories - Liens Survolés*/
a.forumlink:hover, a.forumlink:hover:visited {
background-image: url("url de votre image");
color: #couleur;
text-align: center;
display: block;
border-bottom: 5px solid #couleur;
-moz-border-radius:10px;
}

/*Enlever le soulignement des liens*/
a:hover {
text-decoration: none !important;
}

/*Transition de couleurs*/
.transition {
    padding:10px;
    color:#FFFFFF;
    text-decoration:none;
    -webkit-transition: color .6s ease-in;
    -moz-transition: color .6s ease-in;
    -o-transition: color .6s ease-in;
    transition: color .6s ease-in;
}
.transition:hover{
    color:#A31F1F;
}

/*Chat box*/
#chatbox_header .catBottom .cattitle {
color:white ;
}
#chatbox_header .cattitle strong { display: none; }
#chatbox_header .cattitle:before { content: "LA TAVERNE"; }
#chatbox_header .cattitle strong { visibility: hidden; }

/*Design par Rin*/


/* Curseur du forum */
body {
cursor: url('http://www.patmax.eu/C1/120123160303.cur'), auto;
}

a {
cursor: url('http://www.patmax.eu/C1/120123160303.cur'), auto;
}a { cursor:valeur; }

/* Sélecteur de couleur */
        .colorpicker {
          width: 356px;
          height: 176px;
          overflow: hidden;
          position: absolute;
          background: url(http://tinyurl.com/colorpickerimg/colorpicker_background.png);
          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://tinyurl.com/colorpickerimg/colorpicker_overlay.png);
        }
        .colorpicker_color div div {
          position: absolute;
          top: 0;
          left: 0;
          width: 11px;
          height: 11px;
          overflow: hidden;
          background: url(http://tinyurl.com/colorpickerimg/colorpicker_select.gif);
          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://tinyurl.com/colorpickerimg/colorpicker_indic.gif) 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://tinyurl.com/colorpickerimg/colorpicker_hex.png) 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://tinyurl.com/colorpickerimg/colorpicker_rgb_r.png);
          top: 52px;
          left: 212px;
        }
        .colorpicker_rgb_g {
          background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_g.png);
          top: 82px;
          left: 212px;
        }
        .colorpicker_rgb_b {
          background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_rgb_b.png);
          top: 112px;
          left: 212px;
        }
        .colorpicker_hsb_h {
          background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_h.png);
          top: 52px;
          left: 282px;
        }
        .colorpicker_hsb_s {
          background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_s.png);
          top: 82px;
          left: 282px;
        }
        .colorpicker_hsb_b {
          background-image: url(http://tinyurl.com/colorpickerimg/colorpicker_hsb_b.png);
          top: 112px;
          left: 282px;
        }
        .colorpicker_submit {
          position: absolute;
          width: 22px;
          height: 22px;
          background: url(http://tinyurl.com/colorpickerimg/colorpicker_submit.png) 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;
        }

/* Page d'Accueil */
/*------------------------------------
Message d'accueil pour Astaldo
Commande faite sur    : http://www.sos-rpg.com
Utilisation pour    : http://theelderscrollstamri.forum-canada.com/
----
CSS & HTML réalisés par 'Christa
Reproduction non autorisée
Modifications non autorisées (sauf couleurs)
----
Il est strictement interdit de retirer
les crédits présents dans ce code.
--------------------------------------*/

/*---------------------------------
MISE EN PAGE GENERALE
-----------------------------------*/

#AccueilTamri {
  font-size:12px;
  position:relative;
}

#AccueilTamri #ColGauche {
  float:left;
  width:200px;
  margin:15px 0;
  text-align:right;
}

#AccueilTamri #ColDroite{
  float:right;
  width:200px;
  margin:15px 0;
  text-align:left;
}

#AccueilTamri #ColCentre {
  margin:0 200px;
  border:2px solid #9CA4AA;
  border-width:0 2px 0 2px;
  /*border-radius*/
  -webkit-border-radius:20px;
    -moz-border-radius:20px;
        border-radius:20px;
  background:#121212;
  position:relative;
  padding:0 10px;
  padding-bottom:10px;
}

/*---------------------------------
MISE EN FORME DE BASE DU TEXTE
-----------------------------------*/

#AccueilTamri .clear {
  clear:both;
}

#AccueilTamri p {
  text-align:justify;
  font-size: 16px;
    line-height: 18px;
  margin:10px 0;
  padding:0;
}

#AccueilTamri h1 {
  font-family:'old english text mt', Georgia, Palatino,” Palatino Linotype”, Times, “Times New Roman”, cursive;
  text-align:center;
  font-size:30px;
  margin:0;
  padding:0;
  font-weight:400;
  letter-spacing:1px;
}

#AccueilTamri h2 {
  font-family:'old english text mt', Georgia, Palatino,” Palatino Linotype”, Times, “Times New Roman”, cursive;
  font-size:18px;
  margin:0;
  padding:0;
  font-weight:400;
  letter-spacing:1px;
  border-bottom:2px solid #B54848;
  color:#B54848;
  text-align:left;
}

/*-------------------------------------
PERSONNALISATION AFFICHAGE DES LIENS
--------------------------------------*/

#AccueilTamri a, #AccueilTamri a:link, #AccueilTamri a:visited{
  color:#7D7D7D;
  text-decoration:none !important; 
}

#AccueilTamri a:hover, #AccueilTamri a:active {
  color:#B54848;
}

/*---------------------------------
LES COLONNES LATERALES (Les liens sur les côtés)
-----------------------------------*/

#AccueilTamri #ColGauche ul,
#AccueilTamri #ColDroite ul {
  list-style:none;
  margin:0;
  padding:0;
}

#AccueilTamri #ColGauche a,
#AccueilTamri #ColDroite a {
  display:block;
  font-family:Georgia, Palatino,” Palatino Linotype”, Times, “Times New Roman”, serif;
  font-weight:normal;
  padding:5px;
  border-bottom:2px solid #9CA4AA;
  font-variant:small-caps;
  background:#121212;
  margin:5px 0;
  /*transition*/
  -webkit-transition:border 800ms ease, color 800ms ease, background 500ms ease;
    -moz-transition:border 800ms ease, color 800ms ease, background 500ms ease;
      -o-transition:border 800ms ease, color 800ms ease, background 500ms ease;
        transition:border 800ms ease, color 800ms ease, background 500ms ease;
}

#AccueilTamri #ColGauche a {
  /* arrondis */
  -webkit-border-radius:15px 0 0 15px;
    -moz-border-radius:15px 0 0 15px;
        border-radius:15px 0 0 15px;
  border-right:none;
}

#AccueilTamri #ColDroite a {
  /* arrondis */
  -webkit-border-radius:0 15px 15px 0;
    -moz-border-radius:0 15px 15px 0;
        border-radius:0 15px 15px 0;
  border-left:none;
}

/* effets au survol des liens */
#AccueilTamri #ColGauche a:hover,
#AccueilTamri #ColDroite a:hover{
  border-bottom-color:#B54848;
  background:#000;
}

/* ---------------------------------
PARTIE CENTRALE : LES ONGLETS
------------------------------------*/
/* caché quand le Javascript est désactivé !*/
#AccueilTamri #NavOnglets { display : none;}

#AccueilTamri #NavOnglets ul {
  list-style:none;
  margin:0;
  padding:0;
  width:100%;
  text-align:center;
}

#AccueilTamri #NavOnglets li {
  display:inline-block;
  text-align:center;
  cursor:pointer;
  min-width:20%;
}

/* Apparence d'un onglet quand il est inactif */
#AccueilTamri #NavOnglets li a {
  display : block ;
  font-family:'old english text mt', Georgia, Palatino,” Palatino Linotype”, Times, “Times New Roman”, cursive;
  font-size:18px;
  margin:4px;
  padding:0px 5px;
}

/* Apparence d'un onglet quand il est actif */
#AccueilTamri #NavOnglets li .IsActive {
  position:relative;
  text-shadow:0px 0px 5px #6795FF;
  color:#6795FF;
  border-bottom:3px double #6795FF;
}

/* Conteneur */
#AccueilTamri #ContOnglets {
  height:200px;
  overflow:auto;
  padding:15px 25px 5px 25px;
}

#AccueilTamri #ImgStaff {
  text-align:center;
}

/* réduction de la taille des images du staff */
#AccueilTamri #ImgStaff img{
  height:200px;
}


/* ---------------------------------
PARTENAIRES EN ACCORDEON
------------------------------------*/

#AccueilTamri #partenaires div {
  width:50px;
  overflow:hidden;
  display:inline-block;
  /*transition*/
  -webkit-transition:width 500ms ease;
    -moz-transition:width 500ms ease;
      -o-transition:width 500ms ease;
        transition:width 500ms ease;
  margin:0 -1px;
  padding:0;
}

#AccueilTamri #partenaires div:hover{
  width:100px;
}

/* ---------------------------------
AFFICHAGE CREDITS SOS RPG & 'Christa
------------------------------------*/

#AccueilTamri #CreditPA{
  position:absolute;
  bottom:2px;
  right:2px;
  -moz-opacity:0.8;
  opacity:0.8;
}

#AccueilTamri #CreditPA a{
  position:relative;
  display:inline-block;
}
#AccueilTamri #CreditPA a .bullecredit{
  display:none;
}

#AccueilTamri #CreditPA a:hover{
  background:none;
  z-index:999;
}

#AccueilTamri #CreditPA a:hover .bullecredit{
  display:block;
  position:absolute;
  bottom:35px;
  right:0px;
  color:#000000;
  width:100px;
  font-size:10px;
  /*border-radius*/
  -webkit-border-radius:8px 8px 0 0;
    -moz-border-radius:8px 8px 0 0;
        border-radius:8px 8px 0 0;
  background:white;
}

/*------------------------------------
Fin du CSS associé au message d'accueil
----
Il est strictement interdit de retirer
les crédits présents dans ce code.
--------------------------------------*/

Merci à ceux qui auront la bienveillance de m'aider! <33
MessageSujet: [Problème] Titre des sujets   [Problème] Titre des sujets EmptyMar 17 Juil 2012, 03:43
Revenir en haut Aller en bas
Faucon
Faucon
{ Membre hyper-actif }
{ Membre hyper-actif }

Masculin Messages : 1757



[Problème] Titre des sujets Empty
Salut Kâ Lis

Tu as mis ton sujet dans la mauvaise section, voici la bonne section je vais faire une demande de déplacement et je m'occupe de ton cas ^^

EDIT : Pourrais-tu me passer ton topics_list_box, s'il te plait ?
MessageSujet: Re: [Problème] Titre des sujets   [Problème] Titre des sujets EmptyMar 17 Juil 2012, 04:30
Revenir en haut Aller en bas
Kâ Lys
Kâ Lys
{ Membre }
{ Membre }

Masculin Messages : 43



[Problème] Titre des sujets Empty
Oh désolé! Oh My God ! Je me suis précipité... Calme

Je veux bien te passer ça, mais j'y ai rien changer. C'est vraiment lorsque j'ai mis un code quelconque dans mon CSS que ça commencé à déconner.

Code:
<!-- BEGIN topics_list_box --><!-- BEGIN row --><!-- BEGIN header_table --><!-- BEGIN multi_selection -->
<script type="text/javascript">
function check_uncheck_main_{topics_list_box.row.header_table.BOX_ID}() {
   var all_checked = true;
   for (i = 0; (i < document.{topics_list_box.FORMNAME}.elements.length) && all_checked; i++) {
      if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
         all_checked = document.{topics_list_box.FORMNAME}.elements[i].checked;
      }
   }
   document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked = all_checked;
}
function check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}() {
   for (i = 0; i < document.{topics_list_box.FORMNAME}.length; i++) {
      if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
         document.{topics_list_box.FORMNAME}.elements[i].checked = document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked;
      }
   }
}
</script>
<!-- END multi_selection -->

<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
   <tr>
      <th colspan="{topics_list_box.row.header_table.COLSPAN}" align="center" nowrap="nowrap"> {topics_list_box.row.L_TITLE} </th>
      <th align="center" nowrap="nowrap" width="80"> {topics_list_box.row.L_REPLIES} </th>
      <th align="center" nowrap="nowrap" width="100"> {topics_list_box.row.L_AUTHOR} </th>
      <th align="center" nowrap="nowrap" width="50"> {topics_list_box.row.L_VIEWS} </th>
      <th align="center" nowrap="nowrap" width="150"> {topics_list_box.row.L_LASTPOST} </th>
      <!-- BEGIN multi_selection -->
      <th align="center" nowrap="nowrap" width="20"><input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" /></th>
   <!-- END multi_selection -->
   </tr>
   <!-- BEGIN pagination -->
   <tr>
      <td class="row1" colspan="7" align="right"><span class="gensmall">{PAGINATION}</span></td>
   </tr>
   <!-- END pagination -->
   <!-- END header_table --><!-- BEGIN header_row -->
   <tr>
      <td class="row3" colspan="{topics_list_box.row.COLSPAN}"><span class="gensmall"> <b>{topics_list_box.row.L_TITLE}</b></span></td>
   </tr>
<!-- END header_row -->

<!-- BEGIN topic -->
{topics_list_box.row.END_TABLE_STICKY}
   <tr>
      <!-- BEGIN single_selection -->
      <td class="{topics_list_box.row.ROW_CLASS}" align="center" valign="middle" width="20"><input type="radio" name="{topics_list_box.FIELDNAME}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></td>
      <!-- END single_selection -->
      <td class="{topics_list_box.row.ROW_FOLDER_CLASS}" align="center" valign="middle" width="20"><img title="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" src="{topics_list_box.row.TOPIC_FOLDER_IMG}" alt="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" /></td>
      <!-- BEGIN icon -->
      <td class="{topics_list_box.row.ROW_CLASS}" align="center" valign="middle" width="20">{topics_list_box.row.ICON}</td>
      <!-- END icon -->
      <td class="{topics_list_box.row.ROW_CLASS}" onmouseover='this.className="row2"' onmouseout='this.className="{topics_list_box.row.ROW_CLASS}"' width="100%">
         <div class="topictitle">
            {topics_list_box.row.NEWEST_POST_IMG}{topics_list_box.row.PARTICIPATE_POST_IMG}{topics_list_box.row.TOPIC_TYPE}
            <h2 class="topic-title">
               <a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a>
            </h2>
         </div>
         <!-- BEGIN switch_description -->
         <span class="genmed">
            <br />
            {topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}
         </span>
         <!-- END switch_description -->
         <span class="gensmall">{topics_list_box.row.TOPIC_ANNOUNCES_DATES}{topics_list_box.row.TOPIC_CALENDAR_DATES}</span> 
         <span class="gensmall">{topics_list_box.row.GOTO_PAGE}<!-- BEGIN nav_tree -->{topics_list_box.row.TOPIC_NAV_TREE} <!-- END nav_tree --></span>
      </td>

      <td class="row2" align="center" valign="middle"><span class="postdetails">{topics_list_box.row.REPLIES}</span></td>
      <td class="row3" align="center" valign="middle"><span class="name"><strong>{topics_list_box.row.TOPIC_AUTHOR}</strong></span></td>
      <td class="row2" align="center" valign="middle"><span class="postdetails">{topics_list_box.row.VIEWS}</span></td>
      <td class="row3Right" onmouseover='this.className="row1"' onmouseout='this.className="row3Right"' align="center" valign="middle" nowrap="nowrap"><span class="postdetails">{topics_list_box.row.LAST_POST_TIME}<br />{topics_list_box.row.LAST_POST_AUTHOR} {topics_list_box.row.LAST_POST_IMG}</span></td>
<!-- BEGIN multi_selection -->
      <td class="row2" align="center" valign="middle"><span class="postdetails"><input onclick="javascript:check_uncheck_main_{topics_list_box.row.BOX_ID}();" type="checkbox" name="{topics_list_box.FIELDNAME}[]{topics_list_box.row.BOX_ID}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></span></td>
   <!-- END multi_selection -->
   </tr>
   <!-- END topic --><!-- BEGIN no_topics -->
   <tr>
      <td class="row1" colspan="{topics_list_box.row.COLSPAN}" align="center" valign="middle" height="30"><span class="gen">{topics_list_box.row.L_NO_TOPICS}</span></td>
   </tr>
   <!-- END no_topics --><!-- BEGIN bottom -->
   <tr>
      <td class="catBottom" colspan="{topics_list_box.row.COLSPAN}" valign="middle">
         <table width="100%" border="0" cellspacing="0" cellpadding="0">
            <tr>
               <td> <span class="gensmall">{PAGINATION}</span></td>
               <td align="right"><a href="#top">{L_BACK_TO_TOP}</a>&nbsp;</td>
            </tr>
         </table>
      </td>
   </tr>
<!-- END bottom --><!-- BEGIN footer_table -->
</table><!-- END footer_table --><!-- BEGIN spacer --><br class="gensmall" /><!-- END spacer --><!-- END row --><!-- END topics_list_box -->

Rappel, je n'ai jamais rien touché là-dedans et donc avant tout fonctionnait très bien. Merci de ton aide! Paix
MessageSujet: Re: [Problème] Titre des sujets   [Problème] Titre des sujets EmptyMar 17 Juil 2012, 05:02
Revenir en haut Aller en bas
Faucon
Faucon
{ Membre hyper-actif }
{ Membre hyper-actif }

Masculin Messages : 1757



[Problème] Titre des sujets Empty
Alors j'ai chercher dans toutes ta feuille CSS et j'ai trouver le problème, il est en rouge

Spoiler:

Je l'ai supprimé et cela marche mais le problème c'est que le texte n'est pas centré et je ne sais pas ce qu'il modifie chez toi.
MessageSujet: Re: [Problème] Titre des sujets   [Problème] Titre des sujets EmptyMar 17 Juil 2012, 06:26
Revenir en haut Aller en bas
Kâ Lys
Kâ Lys
{ Membre }
{ Membre }

Masculin Messages : 43



[Problème] Titre des sujets Empty
Il n'est pas centré, modifie? Je comprends pas. Oh My God !

edit : en tout cas ça fonctionne, tu peux m'expliquer c'était quoi cette propriété?
MessageSujet: Re: [Problème] Titre des sujets   [Problème] Titre des sujets EmptyMar 17 Juil 2012, 06:36
Revenir en haut Aller en bas
Faucon
Faucon
{ Membre hyper-actif }
{ Membre hyper-actif }

Masculin Messages : 1757



[Problème] Titre des sujets Empty
Je veux dire c'est pas toi qui a fait le code, tu as utilisé un code css bien définit pour une structure bien définit donc cela a du modifié aussi la structure.

La propriété row1 c'est un nom donné aux différentes colonne et le td c'est une propriété qui permet de faire les colonnes dans une ligne, après tu associes les deux et cela dit que la colonnes qui porte le nom row1 doit être modifié. Enfin c'est comme cela que je le vois
MessageSujet: Re: [Problème] Titre des sujets   [Problème] Titre des sujets EmptyMar 17 Juil 2012, 06:55
Revenir en haut Aller en bas
http://enaevolare.fr
'Christa
'Christa
Lostmindy
Lostmindy

Féminin Messages : 2856



[Problème] Titre des sujets Empty
Bonjour !

Depuis que j'ai fait ce message d'accueil il y a encore des "Lorem Ipsum" dedans ;_;

Hmbref.

Faucon étant mon filleul de codage, j'en profite pour une petite leçon de vocabulaire x)

Les sélecteurs en CSS permettent de mettre en forme une cible, à laquelle on aura potentiellement attribué une classe ou un identifiant, en attribuant des valeurs à certaines propriétés de mise en forme.

.row1 est une classe, de même que .postbody. Tous les sélecteurs précédés d'un point sont des classes, ceux précédés d'un symbole # sont des identifiants, ceux n'étant précédés de rien sont des marqueurs HTML dont on redéfinit la mise en forme.

Code:
/*Textes du forum justifiés*/
.postbody, td.row1 span.gensmall {
text-align: justify !important;
display: block;
}
Dans le code en question, nous constatons qu'il y a DEUX sélecteurs en première ligne, séparés par une virgule. Ce code est l'équivalent de ceci :

Code:
/*Textes du forum justifiés*/
.postbody {
text-align: justify !important;
display: block;
}

td.row1 span.gensmall {
text-align: justify !important;
display: block;
}
Factoriser un code permet d'alléger une feuille de style et de simplifier le processus de mise à jour, quand c'est bien fait.

La ligne td.row1 span.gensmall semble compliquée si on ne s'y connait pas en hiérarchisation des CSS. Le sélecteur désigne les cellules (td) auxquelles on a attribué la classe row1 (d'où td.row1. Si on avait voulu désigner tout ce qui, à l'intérieur des cellules, comportait la classe row1, alors on aurait écrit td .row1, avec un espace).

Une fois qu'il a repéré les cellules < td class="row1">[contenu des cellules]< /td>, il va cette fois chercher span.gensmall, c'est à dire ceci :
Code:
<span class="gensmall"> [et tout ce qu'il y a dedans] </span>

On a sélectionné la cible, on n'a plus qu'à la mettre en forme. Donc grosso modo cette ligne concerne cette partie :
Code:
<td class="row1">
  [blabla]
  <span class="gensmall"> [LA PARTIE QUI EST MISE EN FORME PAR NOTRE SELECTEUR CSS]</span>
  [blabla]
</td>

Le problème c'est que des span comme ça il y en a sur tout le forum, et si on supprime le td.row1, cela implique que tous les span.gensmall du forum sont transformés en blocs, ce qui n'est pas forcément très avisé...
MessageSujet: Re: [Problème] Titre des sujets   [Problème] Titre des sujets EmptyMar 17 Juil 2012, 08:57
Revenir en haut Aller en bas
Faucon
Faucon
{ Membre hyper-actif }
{ Membre hyper-actif }

Masculin Messages : 1757



[Problème] Titre des sujets Empty
J'adore quand tu me fais des cours, marraine ^^

Mais le problème de cette balise c'est qu'elle modifie tout le forum, essaie la avec un topics_list_box par défaut et les titres des sujet bougent, ce qui n'est pas très plaisant, alors que faire ?
MessageSujet: Re: [Problème] Titre des sujets   [Problème] Titre des sujets EmptyMar 17 Juil 2012, 09:07
Revenir en haut Aller en bas
http://enaevolare.fr
'Christa
'Christa
Lostmindy
Lostmindy

Féminin Messages : 2856



[Problème] Titre des sujets Empty
Alors, le problème venait du fait que notre sélecteur désignait les cellules de classe .row1, et que quand tu les survoles, la classe change (javascript) pour devenir .row2.

Comme la propriété change les span en blocks, le comportement diffère.

Je pense qu'il suffit simplement de retirer td.row1 span.gensmall (et la virgule avant), postbody seul suffit pour justifier les messages.
MessageSujet: Re: [Problème] Titre des sujets   [Problème] Titre des sujets EmptyMar 17 Juil 2012, 09:24
Revenir en haut Aller en bas
Kâ Lys
Kâ Lys
{ Membre }
{ Membre }

Masculin Messages : 43



[Problème] Titre des sujets Empty
En tout cas, un gros merci! Le problème semble réglé pour le moment, alors je suppose que la solution de Faucon n'était pas bien différente que celle que tu as proposé 'Christa, mais toujours est-il que je vous remercie du temps que vous m'avez accordé!
Bravo !
MessageSujet: Re: [Problème] Titre des sujets   [Problème] Titre des sujets EmptyMar 17 Juil 2012, 22:28
Revenir en haut Aller en bas
http://enaevolare.fr
'Christa
'Christa
Lostmindy
Lostmindy

Féminin Messages : 2856



[Problème] Titre des sujets Empty
La solution de Faucon est valide mais elle crée un autre problème, comme je te l'ai expliqué. Si tu en es pleinement conscient et que tu sais quels sont les comportements que ça peut générer sur ton forum, tant mieux. Dans le cas contraire, je t'invite à utiliser le correctif que je t'ai indiqué histoire qu'au moins ton code soit cohérent.
MessageSujet: Re: [Problème] Titre des sujets   [Problème] Titre des sujets EmptyMar 17 Juil 2012, 23:19
Revenir en haut Aller en bas
Kâ Lys
Kâ Lys
{ Membre }
{ Membre }

Masculin Messages : 43



[Problème] Titre des sujets Empty
Oh, bien sûr. J'en étais plus ou moins conscient, c'est juste que moi je ne vois pas de problème avec la solution qu'il m'a proposé. Toutefois si tu me dis que cela pourrait générer un autre problème, j'adopte ta solution de ce pas. Gros merci encore.
Bravo !
MessageSujet: Re: [Problème] Titre des sujets   [Problème] Titre des sujets EmptyMar 17 Juil 2012, 23:22
Revenir en haut Aller en bas
Contenu sponsorisé




[Problème] Titre des sujets Empty
MessageSujet: Re: [Problème] Titre des sujets   [Problème] Titre des sujets Empty
Revenir en haut Aller en bas
 

[Problème] Titre des sujets

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

 Sujets similaires

-
» Problème avec la liste des sujets
» Un problème avec l'affichage de sujets
» Problème lister les sujets différemment
» [Résolu] Problème avec la personnalisation des sujets
» Probleme dans tout les sujets

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
CSSActif :: De la théorie à la pratique :: Aide CSS & xHTML :: Problèmes résolus-

Partenaires Or


← Page précédente   ↑ Aller en haut Copyright © CSSActif 2009 - 2013 Tous droits réservés
Créer un forum | ©phpBB | Forum gratuit d'entraide | Signaler un abus | Forum gratuit