Sujets similaires

Bonsoir à tous ^_^

Alors voila, j'ai une demande qui je crois, est assez récurrente et pourtant je n'arrive pas à le résoudre.

J'essaye donc d'avoir des arrondis propre sur mon forum, mais l'intérieur du forum ne suit pas l'arrondis du contour... voici le résultat actuel :

Spoiler:

Pour ce résultat j'ai utilisé le CSS suivant :

Code:: .forumline
{
-moz-border-radius: 10px ;
-webkit-border-radius: 10px;
border: 3px #9B897D solid;
-moz-box-shadow: 0px 0px 20px #7A7776;
-webkit-box-shadow: 0px 0px 20px #7A7776;
}

Et le template index_box suivant :

Code:: <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<tr>
<td valign="bottom">

<span class="gensmall">{LAST_VISIT_DATE}

{CURRENT_TIME}

</span>

<div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
</td>
<td class="gensmall" align="right" valign="bottom">

<a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a>

<a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a>


<a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
</td>
</tr>
</table>
<div class="titre_categorie">{catrow.tablehead.L_FORUM}</div><table class="forumline" width="100%" border="0" cellspacing="0" cellpadding="0">



<tr>

<td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>

<td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
<h{catrow.cathead.LEVEL} class="hierarchy">
<span class="cattitle">
<a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
</span>
</h{catrow.cathead.LEVEL}>
</td>
<td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td>
</tr>


<tr>

<td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>

<td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
<img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
</td>
<td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
<h{catrow.forumrow.LEVEL} class="hierarchy">
<span class="forumlink">
<table width="100%"><tr><td><a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></td> </span><td align="right"> </td> </tr></table></h{catrow.forumrow.LEVEL}>
<div class="forum-description">
<span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
</div>

<span class="gensmall">

{catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}

{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
</span>

</td>


<td class="row3 over" align="center" valign="middle" height="50">
<div class="lastpost">{catrow.forumrow.LAST_POST}</div>
<BR><DIV align=right><span class="gensmall"> <b>Sujets :</b> {catrow.forumrow.TOPICS} | <b>Messages :</b> {catrow.forumrow.POSTS}</span></div>
</td>


<td class="row3" colspan="3" align="center" valign="middle" height="50"><span class="gensmall">{catrow.forumrow.forum_link.HIT_COUNT}</span></td>

</tr>


<tr>

<td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>

<td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
</tr>


</table><img src="{SPACER}" alt="" height="5" width="1" />

J'espère avoir été assez claire, en tout cas merci d'avance pour toute intervention.

Bonjour,

Il faudrait appliquer ce même code à l'enfant (ou aux enfants) de ton .forumline.
Le souci c'est que je ne peux pas te répondre comme ça en te donnant un code, il semble que les classes attribuées à la ligne du tableau soit dynamique.

Aurais-tu un lien à fournir ?

Merci

Essaye d'appliquer la propriété CSS suivante à ton forumline :

Code:: z-index:1000;

Si ça ne marche pas, augmente la valeur Wink

Hello,

Cela ne devrait pas marcher Haribot, puisque les enfants vont suivre le mouvement et que ce sont eux qui n'ont pas les angles arrondis.

++

Bonjour à vous ^_^

Alors Haribot j'ai essayé et effectivement ça n'a pas l'air de fonctionner u_u

Pour ce qui est du lien du forum le voici : http://gabyka.forum-canada.net/forum.htm

Essaye ça, c'est un code du FDF:

Code:: <table cellspacing="0" cellpadding="0">
<tr height="Hauteur de toute la bordure supérieur">
<td width="Largeur de toute la bordure de gauche (minimum 6 pixels)" background="Image du coin supérieur gauche"></td>
<td width="Largeur du tableau" background="Image de remplissage"></td>
<td width="Largeur de toute la bordure droite (minimum 6 pixels)" background="Image supérieure droite" ></td>
</tr>
<tr>
<td background="image de remplissage"></td>
<td background="image de remplissage" >Votre Texte</td>
<td background="image de remplissage"></td>
</tr>
<tr height="Hauteur de la bordure inférieure">
<td background="image coin inférieur gauche"></td>
<td background="image de remplissage"></td>
<td background="image coin inférieur droite"></td>
</tr>
</table>

Et pour que ça se réalise:

Panneau d'Administration -> Modules -> Gestion des pages HTML -> Créer une page HTML.
Après je ne suis pas sûr que ça soit ça... Mad

Avec ce code ça devrait te donner un petit quelque chose :

Code:: .forumline tr:first-child .row1:first-child {
-moz-border-radius: 8px 0 0 0;
-webkit-border-radius: 8px 0 0 0;
border-radius: 8px 0 0 0;
}

.forumline tr:first-child .row3 {
-moz-border-radius: 0 8px 0 0;
-webkit-border-radius: 0 8px 0 0;
border-radius: 0 8px 0 0;
}

.forumline tr:last-child .row1:first-child {
-moz-border-radius: 0 0 0 8px;
-webkit-border-radius: 0 0 0 8px;
border-radius: 0 0 0 8px;
}

.forumline tr:last-child .row3 {
-moz-border-radius: 0 0 8px 0;
-webkit-border-radius: 0 0 8px 0;
border-radius: 0 0 8px 0;
}

L'idée c'est de donner à un des quatre angles un angle arrondi :
- l'angle supérieur gauche pour la première case de la première ligne
- l'angle supérieur droit pour la dernière case de la première ligne
etc...

Bon courage !

PS : last-child n'est pas compris par IE7, mais il est temps d'évoluer Wink

Bonjour !!! Et désolée de répondre que maintenant u__u

Alors j'ai testé tes codes Riku Asakura (parce qu'ils me paraissaient plus simple que la technique de Teal's, j'avoue u_u) sauf que j'ai une petite question (encore u_u)

Je suis censée mettre le code en copier-coller sur ma feuille CSS ou alors il faut que je fasse coin par coin ?

J'explique peut-être mieux mon problème... quand tu vas sur le forum >> clik << j'ai encore des coins qui ne sont pas arrondis (en ayant juste fait le copier-coller)

Genre les coins inférieurs c'est nikel partout, mais les supérieurs, je n'ai que les premiers.

Parce que du coup, s'il faut que je fasse ligne par ligne... j'avoue que je n'ai pas trop compris comment faire ^^"

Ah mince !
Oui c'est bête mais c'est parce que lorsqu'il y a qu'une seule ligne de tableau, celle-ci est :first-child et :last-child en même temps :s

Je ne sais pas si ça fonctionne avec ça en dessous de tout le reste du code que je t'ai donné :

Code:: /*Le premier code ici*/

.forumline tr:first-child:last-child .row1:first-child {
-moz-border-radius: 8px 0 0 8px;
-webkit-border-radius: 8px 0 0 8px;
border-radius: 8px 0 0 8px;
}

.forumline tr:first-child:last-child .row3 {
-moz-border-radius: 0 8px 8px 0;
-webkit-border-radius: 0 8px 8px 0;
border-radius: 0 8px 8px 0;
}

C'est le même principe, mais ça gère l'exception de la ligne du tableau unique. Elle est la première ligne et en même temps la dernière.

Tu me dis si ça fonctionne ou pas Wink

Bonne journée

Mon.... héros *_*

Ca marche parfaitement bien. Merci infiniment !!!!

Topic résolu \o/

Lol,
Je t'en prie, avec plaisir.
Bonne continuation 

Je classe! Wink

Affaire classée.

soucis arrondis du forum

soucis arrondis du forum

Sujets similaires

Sujets similaires

Partenaires Or