Bonjour à toutes et à tous!
Je voudrai un petit renseignement!
En fait, je voudrai faire un cadre spécifique à l'endroit où il y a le dernier membre qui a posté, à "xx" heures minutes, dans "xx" forum.
Bon, je pense pas être très clair, donc je vous ai fait un screen du rendu que je voudrai avoir^^
- Spoiler:
J'ai entouré ce que je voulais obtenir^^
Voici par ailleurs mon code CSS:
- Code:
-
.tableau {
background-image: url('http://i47.tinypic.com/ftko3q.jpg');
width: 850px;
height: 350px;
}
.groupes {
border: 1px solid #000000;
-moz-border-radius: 10%;
-webkit-border-radius: 10%;
padding: 1%;
text-align: center;
}
body.chatbox {
background-image: url('http://i47.tinypic.com/25ickjl.jpg');
}
#chatbox .chatbox_row_1,#chatbox .chatbox_row_2{
background-color: transparent;
}
.lienspa {
text-align: center;
border-left: 5px solid black;
border-right: 5px solid black;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
background-color: #555555;
padding-top: 1%;
padding-bottom: 1%;
}
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: -20px; /* on positionne notre infobulle */
left: 47px;
background: white;
color: 7d7d7d;
padding: 3px;
border: 0px solid grey;
border-left: 5px solid #b6b6b6; /* vos couleurs et taille de bordures */
border-right: 3px solid #b6b6b6;
border-top: 3px solid #b6b6b6;
border-bottom: 5px solid #b6b6b6;
}
body { background-position: center center; }
.forumline {
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
}
.bodyline {
-moz-border-radius-topright: 80px;
}
a.infobulle {
position: relative;
}
a.infobulle span {
display: none; /* ceci masque l'infobulle */
}
a.infobulle:hover {
background: none; /* correction d'un bug IE */
z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
}
a.infobulle:hover span {
display: inline; /* ceci affiche l'infobulle */
position: absolute;
top: 5px; /* on positionne notre infobulle */
left: 15px;
background: #ebebeb; /* arrière-plan de l'infobulle */
color: black; /* texte dans l'infobulle */
padding: 3px;
/* bordures de votre infobulle*/
border: 1px dotted black;
border-left: 1px dotted black;
}
.vignettes
{-moz-border-radius:7px;
background-color: #ffffff;
padding-right:10px;
padding-left:10px;
padding-bottom: 3px;
padding-top:3px;}
.mystats_fa{
padding: 5px;
float:right;
font-family: verdana;
font-size: 10px;
font-weight: bold;
}
input,textarea, select{
background-color: #couleur;
-moz-border-radius:10px;
border:none;
}
a.imginfo {
position: relative;
color: #COULEUR;
text-decoration: none;
border-bottom: VALEURpx #COUELUR 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: VALEURpx; /* on positionne notre infobulle */
left: VALEURpx;
background: white;
color: #COULEUR;
padding: VALEURpx;
border-left: VALEURpx solid #COULEUR;
border-right: VALEURpx solid #COULEUR;
border-top: VALEURpx solid #COULEUR;
border-bottom: VALEURpx solid #COULEUR;
}
.my_modified_table{
width: 80%;
margin-left: 10%;
margin-right: 10%;
margin-top: 5px !important;
font-family: Distant Galaxy;
}
.my_forum_name{
display:none;
}
.my_img{
width: 10%;
margin-left: 50px;
}
.my_disc{
width: 70%;
text-align:center;
font-size: 13px;
}
.my_stats{
font-size: 10px;
width: 20%;
text-align:center;
}
.myfoo_title{
text-align:center;
width: 100%;
-moz-border-radius: 6px;
border: 1px solid #D3C45A;
}
.my_title{
text-align:center;
font-size: 15px;
font-family: Distant Galaxy;
}
.my_cat_body{
border: 1px solid #EEE;
-moz-border-radius: 3px;
}
.my_cat ul{
margin:0;
padding: 0;
width: 800px !important;
}
.my_cat li{
margin-left: 2px;
}
.my_cat_style{
border-top: 1px #666 solid;
border-left: 1px #666 solid;
border-right: 1px #666 solid;
-moz-border-radius-topleft: 6px;
-moz-border-radius-topright: 6px;
text-align:center;
font-size: 10px;
padding-left:10px;
padding-right:10px;
display:inline;
background-color: #D3C45A;
width: 200px;
font-family: Arial;
font-weight: bold;
}
.my_cat a{
text-decoration: none !important;
color: #000;
}
/*personalisation des cadres forum*/
td.row1
{
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
}
td.row2
{
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
}
td.row3
{
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
}
td.row3Right
{
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
}
et mon template index_box:
- Code:
-
<table width="100%" 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>
<div class="my_cat"> <ul></ul> </div>
<div class="my_cat_body">
<!-- BEGIN catrow --><!-- BEGIN tablehead -->
<table class="my_modified_table" width="100%" border="0" cellspacing="1" cellpadding="0">
<div class="my_forum_name">{catrow.tablehead.L_FORUM}</div>
<!-- END tablehead -->
<!-- BEGIN forumrow -->
<tr>
<td colspan="3" class="my_title" align="center"><div class="myfoo_title"><a href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></div><img src="{SPACER}" alt="" height="5" width="1" /></td>
</tr>
<tr>
<td class="my_img" valign="top"><img src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="" /></td>
<td class="my_disc" width="20" valign="top" >{catrow.forumrow.FORUM_DESC}</td>
<td class="my_stats" width="20" valign="top">
{catrow.forumrow.LAST_POST}<br />
Sujets : {catrow.forumrow.TOPICS}<br />
Messages : {catrow.forumrow.POSTS}<br />
</td>
</tr>
<!-- END forumrow -->
<!-- BEGIN tablefoot -->
</table><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->
</div>
Merci de votre aide!