Sujets similaires

Bonjour

Voilà je suis en train de tester du codage pour mon forum sur le papier ou plutot toshop c très simple cependant une fois arriver en codage ce vilain semble refuser catégoriquement de faire ce que je veux.

Rendu souhaité ( fait sous toshop)
Description forum et liens sous forum: soucis de positionement [Non résolu] 156510

Description forum et liens sous forum: soucis de positionement [Non résolu] 156510

seconde ligne dans ce cas ci

voici l'adresse de mon forum de test: http://kitdesign.superforum.fr/
Le dernier forum "magazine" étant ma base pour vérifier le code

Tout d'abord je suis en version phpb2, compte fondateur et firefox derniere version sur le pc

Mon soucis étant je pense la structure même, en utilisant système D et decryptage du template j'ai réussi a avoir un effet approchant approximativement mais ce n'est pas encore ça.
Pour la seconde colone ( titre + description/image + liens sous forums) l'image doit pouvoir etre différente pour chaque forum ainsi que le texte (logique)
ici j'ai coler les trois version les une aux autre en donnant un effet de cohérence grace au border. J'ai tenter a tout mettre sous une seule class pour la description mais cela déformait tout.

Ce que que voudrait en premier lieu c'est que la barre des sous forum passe SUR et non SOUS l'image de la description du forum.
J'aimerai aussi comme sur l'image et ce que j'avais tenter qu'il y ai un bloc avec bordure donc et que le titre et sous forum viennent s'y ajouter.
Je ne suis pas sur d'être très clair n'hésiter pas à me poser des questions précise je tacherai de faire mieux.
S'il y avait une méthode pour garder le bloc et ajouter donc le titre et sous forum avec certain niveau pourrait on dire sans déformer le tout

Voici mes codage

Template:

Spoiler:

Code:: <table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
<tr>
   <td valign="bottom">
      
      <span class="gensmall">{LAST_VISIT_DATE}<br />
      {CURRENT_TIME}<br />
      </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><br />
      <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
      
      <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
   </td>
</tr>
</table>
<div class="TitreCategorie">{catrow.tablehead.L_FORUM}</div><table class="forumline" width="100%" border="0" cellspacing="1" 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="40"><img src="{SPACER}" height="0" width="40" 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">
            <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a><br /></span>
      </h{catrow.forumrow.LEVEL}>
      <div class="genmed descriptions-categories">{catrow.forumrow.FORUM_DESC}</div>
      <span class="gensmall">
         
         {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
         
</span>
         <div class="souforums">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div>

   </td>
         <td class="row3 over" align="center" valign="middle" height="50">
<span class="gensmall">
<div class="sujets_messages">Messages : {catrow.forumrow.POSTS} | Sujets : {catrow.forumrow.TOPICS}</div>
<div class="derniers_sujets">{catrow.forumrow.LAST_POST}</div></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" />

CSS

Spoiler:

Code:: /* ------------------------------------------------------------------------------------------------------ */
/* TITRE DES CATEGORIE */
/* Mise en forme du "bloc" qui contient le titre */
.TitreCategorie {
background: #121114; /*fond*/
/* Des coins arrondis */
border-radius:90px 90px 0 0;
-moz-border-radius:90px 90px 0 0;
-wekbit-border-radius:90px 90px 0 0;
width: 600px; /*largeur à modifier selon vos goûts*/
margin:auto; /* on centre le bloc */
margin-top:6px; /* on centre le bloc */

padding:1px; /*espace entre la bordure et le texte*/
border:2px solid #01262E;
border-bottom:0px;
}

/* mise en forme du titre lui-même */
.TitreCategorie h2 {
margin:0; /* le titre a des marges par défaut, pour éviter de 'casser' nos réglages, on remet à zéro ici */
text-align: center; /*alignement du texte par rapport au bloc qui le contient */
letter-spacing:2px; /* espacement entre les lettres */
font-variant:small-caps; /* texte en petites majuscules */
color:#000000; /* couleur du texte */
font-family: Geneva, Tahoma, Verdana, sans-serif;
font-size:15px;}

/* ------------------------------------------------------------------------------------------------------ */
/* Colone droite sujet/message/ dernier message posté*/
.sujets_messages {
margin-top: -6px;
margin: 2px;
padding: 2px; /* pour ne pas que le texte se colle aux bords du cadre */

/* après on peut rajouter ce qu'on veut : une bordure, une image de fond ... */
border: 1px solid #000000;
background: #28282a;
}

.derniers_sujets {
margin: 2px
margin-top: 3px; /* pour faire un léger espace entre la ligne des "messages & sujets" et "dernier message posté" */
padding: 2px; /* pour ne pas que le texte se colle aux bords du cadre */
width:140px; /* Largeur de la cellule du dernier message posté */
/* après on peut rajouter ce qu'on veut : une bordure, une image de fond, des coins arrondis un peu originaux... */
border-top: 2px dotted #000000;
background: #28282a;
border-radius:1px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
}

/* ------------------------------------------------------------------------------------------------------ */
/* deco description forums general bloc */
.descriptions-categories {
margin-top: -14px;
margin-right: 6px;
border-left: 4px solid #01262E;
border-right: 4px solid #01262E;
-moz-border-radius: 0px 0px 5px 5px;
border-radius: 0px 0px 5px 5px;
-webkit-border-radius: 0px 0px 5px 5px;
background: #28282a;
text-align:justify;
height: 79px;
padding: 4px; /* pour ne pas que le texte se colle aux bords du cadre */}

a.forumlink {
margin-top: 5px;
font-variant: small-caps;
text-decoration: none;
-moz-border-radius:5px 5px 0px 0px;
border-radius:5px 5px 0px 0px;
-webkit-border-radius:5px 5px 0px 0px;
background-color: #000000;
border-bottom:0px double #000000;
border-top:0px double #000000;
border-left: 4px solid #01262E;
border-right: 4px solid #01262E;
display:block;
font-family: Georgia;
font-size:11px;
font-weight:bold;
margin-right: 6px;
text-align:center;
letter-spacing:1px !important;}

.souforums{
margin-top: -20px;
margin-right: 6px;
text-align: right;
-moz-border-radius:0px 0px 0px 0px;
-webkit-border-radius : 0px 0px 0px 0px;
border-radius : 0px 0px 0px 0px;
background-color: #151516;
border-left: 4px solid #01262E;
border-right: 4px solid #01262E;
word-spacing: 2px;
display:block;
font-size:10px;
font-family: Georgia;
}

/* ----------------- image flottante---------------------*/

.imageflottante
{ float: right ;
margin-right: -3px ;
margin-left: 4px ;
margin-top: -18px ;
}

.stopflottant
{ clear: both ;
}

/* ------------------------------------------------------------------------------------------------------ */

td.row3 {
width:100px;
height:100px
background-image: url("http://nsa32.casimages.com/img/2013/01/24//130124015320868490.png");
margin:auto;
background: #121114;

}

td.row3Right {
width:100px;
height:100px
margin:auto;
background-image: url("http://nsa32.casimages.com/img/2013/01/24//130124015320868490.png");
background: #121114;

}

td.row3.over:hover {
width:100px;
height:100px
background-image: url("http://nsa32.casimages.com/img/2013/01/24//130124015320868490.png");
margin:auto;
background: #121114;

}

.descripfofo {
margin-right: -10px ;
margin-left: 0px ;
margin-top: -19px ;
}

HTML

Spoiler:

EDIT: j'ai rebidouillé avec du html en background ca donne l'effet de passer dessus cependant en haut ce n'est pas encore ça même si ca s'en rapproche fort, je voudrai cette bande au dessus du titre du forum( fond noir) et je pense surtout qu'il doit y avoir une façon d 'avoir des code plus simple et plus propre que mon bidouillage. Donc j'accepte toujours aide et conseil. En vous remerciant de jeter un oeil a mon casse tete

Hey, la propriété z-index en css répond sûrement à ton problème. Comme je ne suis pas doué pour les explications, un petit lien se suffira peut-être de lui-même. Me semble qu'en mettant la propriété à 1 au bloc des sous-forums, ça peut marcher. À tester. Wink

Attention, il est nécessaire de positionner tes éléments (avec la propriété position notamment) pour utiliser z-index.
En espérant que tu t'en sortes.

@Enceladus > Merci de ton coup de main soit dit en passant Wink

@Kyana > Est-ce-que la réponse d'Enceladus a résolu ton problème ? Qu'en est-il actuellement ?

Bonjour je n'avais pas vu le premier post merci.

J'avoue que pour l'instant de visu c'est du chinois, en même temps je me leve ai ai eu droit a du mega casse tête hier soir et suis pas prête à en decripter un nouveau today. lol
D'après le peu que j'ai compris du site anglais et de l'essai sur leur site ce code pourrais m’être grandement utile donc un grand merci même si ce n'est pas pour la description/structure de l'index. j'irai m'y faire les deux à n'en pas douté. Un grand merci Enceladus.

Si cela fonctionne sur le code de l'image ou sous forum cela pourrait allégé mon code donc c'est déjà un plus si ca me permet de virer la table que j'avais mis.
Cependant c'est la parti supérieur de la structure qui me posait soucis avec le titre forum dans le bloc de description. Même si j'aime le rendu actuel cela me contrarie de ne pas réussir l'effet que j'avais en tête à la base. Après peut etre cela n'est pas possible sans transformé mon index en bagdad mais je tiens bon.

Donc si quelqu'un à un début d'idée sur comment inséré le titre forum dans le bloc ( la ce n'est point le cas il est collé au dessus et l'image remonte dessus) je cherche comme sur photo a ce qu'il y ai un peu du bloc description au dessus.

Merci en tout cas mercredi vais bosser la dessus et voir comment ca peut m aider.
Merci Espeon pour avoir remonter le sujet j'ai du virer le premier mail de notif par erreur.

Hello !
Je viens aux nouvelles : le sujet est-il toujours d'actualité ?
Si nous n'avons pas de réponse dans 4 jours, il sera considéré comme résolu !
Merci de ta compréhension Description forum et liens sous forum: soucis de positionement [Non résolu] 926145

Description forum et liens sous forum: soucis de positionement [Non résolu] 926145

Je n'ai malheureusement toujours pas trouver de solution. S'il n'y en a pas et bien on fera sans et inventera autre chose. L'effet était bien joli en photo mais semble a priori impossible a réaliser en code sans provoquer un effet massacre a la tronconeuse.

Hello !
Je viens aux nouvelles : le sujet est-il toujours d'actualité ?
Si nous n'avons pas de réponse dans 4 jours, il sera considéré comme résolu !
Merci de ta compréhension Description forum et liens sous forum: soucis de positionement [Non résolu] 926145

Pas de solution à ce probleme de code. Je pense que c'est donc impossible.
Merci et donc oui nous pouvons abandonner ce sujet.

Dommage.

Description forum et liens sous forum: soucis de positionement [Non résolu] 825433

Je déplace, donc. Bon courage malgré tout. Smile

Description forum et liens sous forum: soucis de positionement [Non résolu]

Description forum et liens sous forum: soucis de positionement [Non résolu]

Sujets similaires

Sujets similaires

Partenaires Or