Bonjour,
Tout d'abord je voulais vous remercier du fond du cœur de votre immense travail et de mettre si gentiment vos superbes codes en libre service.
J'ai cependant une question vis à vis d'une de vos catégories. Il s'agit de l'avant dernière postée (celle avec un avatar du dernier posteur en triangle).
La hauteur de la barre de titre de la catégorie s'affiche mal.
De ce sue je comprend de votre code, la hauteur globale de cet élément est déterminée par la taille de la police utiilisée. Je n'ai pas nodifié cet élément et les 42px text-transform: uppercase; en Arial du code deviennent au mieux un petit 22px sans text-transform en Arial.
Je vous fourni un imprim écran, le CSS et le template pour que vous visualisiez mieux le problème
CSS:
- Code:
-
/**CATEGORIES CATEGORIES CATEGORIES CATEGORIES CATEGORIES**/
/* BLOC TITRE CATEGORIE */
.tleCAT{
margin:5px auto;
width:850px; padding:20px 0; text-align:center;
background:#b7b0a0; /* MODIFIABLE */
}
/* TITRE CATEGORIE */
.tleCAT h2{
margin:0;
font-size:42px; text-transform:uppercase; letter-spacing:3px;
font-family:Arial; color:#123134; /* MODIFIABLE */
}
/* BLOC FORUM */
.FRM {
margin:5px auto;
width:850px; height:160px; overflow:hidden; text-align:left;
background:#e2e0e0; /* MODIFIABLE */
}
/* BLOC AVATAR DERNIER POSTEUR FORUM */
.avaFRM {
display:inline-block; vertical-align:top;
width:200px; height:150px; overflow:hidden;
background:#b7b0a0; /* MODIFIABLE */
}
.avaFRM img {
width:200px;
}
/* TRIANGLE AVATAR DERNIER POSTEUR FORUM */
.triAVA {
position:absolute; z-index:3; margin-top:-150px; margin-left:100px;
width:0; height:0; border-style:solid; border-width:0 0 150px 100px; border-color:transparent;
border-bottom-color:#e2e0e0; /* MODIFIABLE */
}
/* BLOC TITRE / NOMBRE SUJETS & MESSAGES / DESCRIPTION / SOUS-FORUMS */
.boxFRM {
display:inline-block; vertical-align:top;
width:540px; height:115px; padding-top:30px;
text-align:center; text-transform:uppercase;
transition:all 0.55s linear; -webkit-transition:all 0.55s linear;
}
.boxFRM:hover {
height:125px; padding-top:20px;
}
/* TITRE ET SA BORDURE FORUM */
.tleFRM a{
padding-bottom:5px; border-bottom:1px solid;
border-bottom-color:rgba(250,250,250,0.5); color:#068783 !important; /* MODIFIABLE */
text-transform:uppercase; font-size:24px; font-family:Arial;
}
.boxIIFRM {
margin-top:15px; height:75px; overflow:hidden;
}
/* BLOC NOMBRE SUJETS & MESSAGES */
.nbFRM {
display:inline-block; vertical-align:top;
width:300px; font-size:24px; text-align:center;
transition:all 0.55s linear; -webkit-transition:all 0.55s linear;
}
.nbFRM div {
display:inline-block; vertical-align:top;
width:100px; height:40px; padding-top:10px;
}
.boxFRM:hover .nbFRM{
margin-top:-50px;
}
/* NOMBRE SUJETS FORUM */
.nbFRM div:nth-of-type(1){
background:#FEFEFE; color:black; /* MODIFIABLE */
}
/* NOMBRE MESSAGES FORUM */
.nbFRM div:nth-of-type(2){
margin-left:10px;
background:#CCC; color:black; /* MODIFIABLE */
}
/* DESCRIPTION FORUM */
.descFRM {
margin:auto; margin-top:25px;
width:520px; height:50px; padding-right:5px; overflow:auto;
color:white; /* MODIFIABLE */
font-size:10px; text-align:justify; text-transform:none;
transition:all 0.55s linear; -webkit-transition:all 0.55s linear;
}
.boxFRM:hover .descFRM {
margin-top:0;
}
/* SOUS-FORUMS */
.sfFRM {
width:490px; height:25px; overflow-y:auto; color:rgba(0,0,0,0);
}
/* LIEN SOUS-FORUM */
.sfFRM a{
display:inline-block; vertical-align:top; margin-top:8px; padding:2px 5px;
background:white; color:black !important; /* MODIFIABLE */
text-align:center; font-size:10px;
}
/* TRIANGLE DERNIER MESSAGE FORUM */
.triFRM {
position:absolute; margin-top:-85px; margin-left:763px; width:0; height:0;
border-style:solid; border-width:10px 17.3px 10px 0; border-color:transparent;
border-right-color:white; /* MODIFIABLE */
}
/* BLOC DERNIER MESSAGE FORUM */
.lmsgFRM {
display:inline-block; vertical-align:top;
width:70px; height:150px;
}
/* DERNIER MESSAGE FORUM */
.lmsgFRM div{
margin-top:40px;
width:150px; height:50px; padding:10px 0; overflow:hidden;
font-size:10px; text-align:center; text-transform:uppercase;
background:white; color:black; /* MODIFIABLE */
transform:rotate(90deg); -webkit-transform:rotate(90deg);
}
/* COULEUR TITRE DERNIER SUJET FORUM */
.lmsgFRM a{
color:black !important; /* MODIFIABLE */
}
/* ICÔNES FORUM */
.imgFRM{
width:850px; height:10px;
}
Template modifié (uniquement la largeur de la Frame):
- Code:
-
<table width="850px" border="0" cellspacing="1" cellpadding="0" align="center">
<tr>
<td valign="bottom">
<!-- BEGIN switch_user_logged_in -->
<span class="gensmall">{LAST_VISIT_DATE}<br />
{CURRENT_TIME}<br />
</span>
<!-- END switch_user_logged_in -->
<div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
</td>
<td class="gensmall" align="right" valign="bottom">
<!-- BEGIN switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
<a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
<!-- END switch_user_logged_in -->
<a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
</td>
</tr>
</table>
<!-- BEGIN catrow --><!-- BEGIN tablehead -->
<div class="tleCAT">{catrow.tablehead.L_FORUM}</div>
<!-- END tablehead -->
<!-- BEGIN cathead -->
<!-- END cathead -->
<!-- BEGIN forumrow -->
<div class="FRM"><div class="avaFRM"><!-- BEGIN avatar -->{catrow.forumrow.avatar.LAST_POST_AVATAR}<!-- END avatar --></div><div class="triAVA"></div><div class="boxFRM"><div class="tleFRM"><a href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></div><div class="boxIIFRM"><div class="nbFRM"><div>{catrow.forumrow.TOPICS}</div><div>{catrow.forumrow.POSTS}</div></div><div class="descFRM">{catrow.forumrow.FORUM_DESC}</div><div class="sfFRM">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div></div></div><div class="triFRM"></div><div class="lmsgFRM"><div>{catrow.forumrow.LAST_POST}</div></div><img class="imgFRM" src="{catrow.forumrow.FORUM_FOLDER_IMG}" /></div>
<!-- END forumrow -->
<!-- BEGIN catfoot -->
<!-- BEGIN inc -->
<!-- END inc -->
<!-- END catfoot -->
<!-- BEGIN tablefoot -->
<!-- END tablefoot --><!-- END catrow -->
Bien à vous,
Je vous remercie de prendre le temps de lire ce message et de votre réponse, quelle qu'elle soit.