AccueilAccueil  Dernières imagesDernières images  RechercherRechercher  S'enregistrerS'enregistrer  ConnexionConnexion  
Le Deal du moment :
Xiaomi Mi Smart Camera 2K Standard Edition (design ...
Voir le deal
11.39 €

Codage image de fond pour les catégories [résolu]


InvitéAnonymous
bonjour!
J'essaye de faire un nouveau thème et pour ça je voulais reproduire le code du thème présent concernant l'image de fond catégories. Cependant j'ai un problème mon image ne s'applique pas à la cellule concernant "dernier" message.

Je suis allée dans mes templates, j'ai garder la class "secondaryquelquechose" et j'ai mis un code dans ma feuille CSS mais j'ai le problème expliqué ci-dessus.

Quelqu'un pourrait m'aider s'il vous plaît?
En tout cas merci d'avance pour toute vos réponses.
InvitéMer 21 Nov - 20:18
InvitéAnonymous
Bonsoir Noloka,

Pour t'aider, il nous faudrait ton template index_box et le codage CSS que tu emploies pour cette partie ;) N'oublie pas de les mettre entre les balises [code] s'il te plait ! Un petit screen du problème ou le lien vers ton forum serait également apprécié si c'est possible.
InvitéMer 21 Nov - 20:35
InvitéAnonymous
Je suis bêêêête! Enfin bref voilà j'ai ça:

Spoiler:

et je veux que mon image englobe tout ça:

Spoiler:

Alors alors j'ai essayé de changer mon template 'je pensais qu'il fallait changer la largeur de la celulle mais je n'ai pas vu de changement flagrant donc....). Bref le voilà:

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>
<!-- BEGIN catrow -->
<!-- BEGIN tablehead -->
<table class="forumline" width="100%" border="0" cellspacing="0" cellpadding="0">
   <tr class="tete_categorie">

      <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
   
          </tr>
   <!-- END tablehead -->
   <!-- BEGIN cathead -->
     <tr>
      <!-- BEGIN inc -->
      <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
      <!-- END inc -->
      <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">&nbsp;</td>
   </tr>
   <!-- END cathead -->
   <!-- BEGIN forumrow -->
   <tr>
      <!-- BEGIN inc -->
      <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
      <!-- END inc -->
      <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}>
         <span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
         <span class="gensmall">
            <!-- BEGIN switch_moderators_links -->
            {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
            <!-- END switch_moderators_links -->
            {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
         </span>
      </td>
         
      <td class="row3 over" align="center" valign="middle" height="50" width="150"><div div style="width:150px;">
                  <span class="gensmall">{catrow.forumrow.LAST_POST}</span> </div><br/>
<span class="gensmall"> {catrow.forumrow.POSTS} messages, {catrow.forumrow.TOPICS} sujets </span>
 
      </td>
   </tr>
   <!-- END forumrow -->
   <!-- BEGIN catfoot -->
   <tr>
      <!-- BEGIN inc -->
      <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
      <!-- END inc -->
      <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
   </tr>
   <!-- END catfoot -->
   <!-- BEGIN tablefoot -->
</table><img src="{SPACER}" alt="" height="5" width="1" />
<!-- END tablefoot -->
<!-- END catrow -->

je suis certainement chiante mais si tu trouves est-ce tu pourrais m'expliquer comment tu as procédé? Merci d'avance ;)
InvitéJeu 22 Nov - 20:47
InvitéAnonymous
Et ta feuille de style CSS, au passage ? xD

Je dirais que ça vient de ta .class tete_categorie mais j'ai besoin du CSS pour voir si tu as mis une largeur ou un repeat ou si c'est l'image qui n'est pas bon. Cependant, comme ça coupe directement à la colonne derniers messages, c'est possible que ça vienne d'un colspan pas à jour dans ton template, faut que je me penche davantage là-dessus ><
InvitéMar 27 Nov - 17:43
InvitéAnonymous
Et Mince! J'ai oublié le CSS XD

Il est là
Code:

.secondarytitle
{
background-color: #;
background-image: url("http://img15.hostingpics.net/pics/326487fofo.png");
background-repeat: no-repeat;
background-position: center;
height:200px;
}

.row3 over {
  witdh=150px



hm... je n'ai pas utilisé tete_categorie. Vu que je n'ai qu'une seule cellulle je pensais que ça ne pouvais pas être ça mais maintenant que tu le dis....

EDIT:
non j'ai essayé en changeant secondaytitle par tete_category ça ne marche pas... Aussi J'avais mis un
witdh="1100px";
Dans ma secondarytitle et ça n'avait pas marché non plus (1100px c'est la taille de mon image vu que celles du forum est de 800px je me suis dit qu'elle aurait dû remplir s'il n'y avait pas de problème dans mon code...).
InvitéMer 28 Nov - 15:32
InvitéAnonymous
j'annonce que j'ai fait des progrés! Mais je bloque toujours.

Bon maintenant j'aobient ça:
Spoiler:

Mais je voudrais qu'il n'y aucun espace entre mon titre de catégorie (l'image acceuil) et mon gros bloc noir.

J'ai tout supprimer sur mon CSS sauf ce qui concerne .row3 over et voici mon nouveau templates "j'ai juste rajouter
Code:
<img src="http://img15.hostingpics.net/pics/326487fofo.png" alt="" height="199" width="100%" />
après :
begin tablehead

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>
<!-- BEGIN catrow -->
<!-- BEGIN tablehead -->
<img src="http://img15.hostingpics.net/pics/326487fofo.png" alt="" height="199" width="100%" />
<table class="forumline" width="100%" border="0" cellspacing="0" cellpadding="0">
   <tr>

      <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
   
   <!-- END tablehead -->
   <!-- BEGIN cathead -->
     <tr> </tr>
      <!-- BEGIN inc -->
          <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
      <!-- END inc -->
      <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">&nbsp;</td>
   </tr>
   <!-- END cathead -->
   <!-- BEGIN forumrow -->
   <tr>
      <!-- BEGIN inc -->
      <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
      <!-- END inc -->
      <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}>
         <span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
         <span class="gensmall">
            <!-- BEGIN switch_moderators_links -->
            {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
            <!-- END switch_moderators_links -->
            {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
         </span>
      </td>
         
      <td class="row3 over" align="center" valign="middle" height="50" width="150"><div div style="width:150px;">
                  <span class="gensmall">{catrow.forumrow.LAST_POST}</span> </div><br/>
<span class="gensmall"> {catrow.forumrow.POSTS} messages, {catrow.forumrow.TOPICS} sujets </span>
 
      </td>
   </tr>
   <!-- END forumrow -->
   <!-- BEGIN catfoot -->
   <tr>
      <!-- BEGIN inc -->
      <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
      <!-- END inc -->
      <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
   </tr>
   <!-- END catfoot -->
   <!-- BEGIN tablefoot -->
</table><img src="{SPACER}" alt="" height="5" width="1" />
<!-- END tablefoot -->
<!-- END catrow -->


Ahahha j'y suis presque et pourtant j'ai l'impression d'être encore loin du but... SNNNIIIIIIIFFFFFFFF
InvitéMar 11 Déc - 17:34
Madame PoulpeMadame Poulpe
Codeuse
Sexe : FémininMessages : 953p.a : 555Age : 32Inscription : 30/05/2012
Avant de t'aider une simple question : le bloc noir c'est quoi ? Une catégorie ou ta PA ? Ou un truc que tu as ajouté ?

Si c'est un truc que tu as ajouté ou la PA, tu peux utiliser le magique margin-bottom avec une valeur négative en pixel.
Madame PoulpeJeu 13 Déc - 17:02
InvitéAnonymous
c'est ma catégorie (enfin je crois?).

J'ai fait margin-bottom: valeur négative et..... ça marche!!!!!

Problème résolu!!! ahaha je suis trop contente que ça marche enfin!! héhé Merci beaucoup à vous deux en tout cas!
InvitéJeu 13 Déc - 21:55
InvitéAnonymous
Bon alors désolé du double post mais je ne sais pas comment on fait pour supprimer!

Bon alors Hier je me suis un peu emballée (et avec la fatigue je n'ai pas vu le petit truc rouge qui dépasse) et le problème n'est pas entièrement réglé
j'ai ça:
Spoiler:

Je me demandais s'il y avait moyen que mon image recouvre tout? (Bah comme dans le forum ici en sorte).

Voilà mon nouveau CSS:
Code:

.tete_categorie{
  margin-bottom:-100px;
}

.row3 over {
  witdh=100px;
}

a.forumlink{ 
  display:block;
  font-size:14px; /* la taille de la police */
  padding:2px; /* Pour éviter que le texte ne soit collé aux bords de la case */
  text-align:center; 
  font-variant:small-caps; /* Les petites capitales */
  color:# !important; /* On force l'application de cette propriété grâce au !important */
  border-top:4px double #ffffff;
  font-weight:normal; /* Le texte non boldé */ 
  margin-bottom:0; /* Pour qu'il n'y ait pas trop d'espace entre le titre et ce qu'il y a en dessous */ 
}

etle template:

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>
<!-- BEGIN catrow -->
<!-- BEGIN tablehead -->
<img src="http://img15.hostingpics.net/pics/326487fofo.png" class="tete_categorie" alt="" witdh="100%" height=200px />
<table class="forumline" width="100%" border="0" cellspacing="0" cellpadding="0">
   <tr>

      <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>
   
   <!-- END tablehead -->
   <!-- BEGIN cathead -->
     <tr> </tr>
      <!-- BEGIN inc -->
          <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
      <!-- END inc -->
      <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">&nbsp;</td>
   </tr>
   <!-- END cathead -->
   <!-- BEGIN forumrow -->
   <tr>
      <!-- BEGIN inc -->
      <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
      <!-- END inc -->
      <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}>
         <span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
         <span class="gensmall">
            <!-- BEGIN switch_moderators_links -->
            {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
            <!-- END switch_moderators_links -->
            {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
         </span>
      </td>
         
      <td class="row3 over" align="center" valign="middle" height="50" width="150"><div div style="width:150px;">
                  <span class="gensmall">{catrow.forumrow.LAST_POST}</span> </div><br/>
<span class="gensmall"> {catrow.forumrow.POSTS} messages, {catrow.forumrow.TOPICS} sujets </span>
 
      </td>
   </tr>
   <!-- END forumrow -->
   <!-- BEGIN catfoot -->
   <tr>
      <!-- BEGIN inc -->
      <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
      <!-- END inc -->
      <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
   </tr>
   <!-- END catfoot -->
   <!-- BEGIN tablefoot -->
</table>
<img src="http://img15.hostingpics.net/pics/326487fofo.png" class="bas_categorie" alt="" witdh="100%" height=200px />

<!-- END tablefoot -->
<!-- END catrow -->

<img src="{SPACER}" alt="" height="5" width="1" />
InvitéVen 14 Déc - 15:51
Madame PoulpeMadame Poulpe
Codeuse
Sexe : FémininMessages : 953p.a : 555Age : 32Inscription : 30/05/2012
C'est la taille de ton truc noir qui ne recouvre pas tout ? Il a une largeur de 100% ?
(c'est pas facile d'aider sans savoir quelle propriété appartient à quoi^^)
Madame PoulpeVen 14 Déc - 17:01
InvitéAnonymous
héhé désolé c'est vrai que je n'y ai paspensé alors alors:

Mon image a une largeur de 1100px elle est dans tablehead et je lui ai donné la class="tete_categorie"

Mais j'ai déjà fait le test et si je prend l'image du forum ici (800px de largeur) mon image recouvre le même domaine. Et dans les proprités de l'image j'ai mis 100% donc je ne sais pas...
InvitéVen 14 Déc - 17:16
Madame PoulpeMadame Poulpe
Codeuse
Sexe : FémininMessages : 953p.a : 555Age : 32Inscription : 30/05/2012
C'est à cause de ton image de 1100px alors, elle déforme le forum. En gros ça "dépasse", donc ce n'est pas compris dans les propriétés (800px).

La solution consisterait donc à réduire ton image (en prenant en compte les bordures donc tu enlèves quelques pixels). :)

Enfin sauf si j'ai compris de travers, ce qui est possible vu mes neurones. XD
Madame PoulpeVen 14 Déc - 18:32
InvitéAnonymous
Et bien j'aichangé mon image en mettant une largeur de 800px mais le problème reste le même j'ai toujours ce petit bout qui dépasse.

Par ccontre je ne vois pas quand tu parles de "bordures"? Tu parles de quoi?
InvitéVen 14 Déc - 19:39
Madame PoulpeMadame Poulpe
Codeuse
Sexe : FémininMessages : 953p.a : 555Age : 32Inscription : 30/05/2012
En bordure je parle des bordures du tableau du forum qui sont généralement de 1px (haut, bas, côtés). ^^

Quelle est la largeur de ta bannière ? Quoique… Ca déformerait les catégories aussi… Mh… Je réfléchis mais je vois pas pour le moment. :/
Madame PoulpeVen 14 Déc - 20:04
InvitéAnonymous
Alors alors, après avoir posé ma question un peu partout on m'a suggéré de changer ma résolution d'écran (je suis actuellement sur du 1366x768).

J'ai donc changé pour du 1280x768... Et ça marche!
Mais dès que je remet ma résolution d'avant (qui est la résolution recommendée pour mon ordi) ça ne marche plus.
Par contre pour le forum d'ici, ça marche tout le temps quelque soit la résolution que je mets.

Donc maintenant le vrai problème est: comment m'assurer que les visiteurs qui passent sur mon forum auront ce que j'obtient avec une résolution de 1280x768? (c'est à dire l'image qui recouvre tout) S'il a une autre résolution il obtiendra quelque chose d'autre non? Mais sur E.T on obtie,t le même résultat quelque soit la résolution coment faire pour que ce sout pareil pour moi?
InvitéJeu 27 Déc - 16:11
InvitéAnonymous
Bonsoiiiiiir!
Juste pour dire que j'ai trouvé comment faire si ça vous intéresse :
-J'ai fixé la largeur de mon forum à 800 (généralité -> Configuration)
-J'ai suivi les consignes données dans ce sujet: [Vous devez être inscrit et connecté pour voir ce lien]
-Par contre dans le CSS img_haut j'ai rajouté margin-bottom:-100px

Bref problème réglé! Merci pour vous être intéressé à mon soucis en tout cas ;)
InvitéSam 29 Déc - 19:47
InvitéAnonymous
Bonsoiiiiiir!
Juste pour dire que j'ai trouvé comment faire si ça vous intéresse :
-J'ai fixé la largeur de mon forum à 800 (généralité -> Configuration)
-J'ai suivi les consignes données dans ce sujet: [Vous devez être inscrit et connecté pour voir ce lien]
-Par contre dans le CSS img_haut j'ai rajouté margin-bottom:-100px

Bref problème réglé! Merci pour vous être intéressé(e)s à mon soucis !!! ;)
InvitéDim 30 Déc - 18:52
Contenu sponsorisé
Contenu sponsorisé

Codage image de fond pour les catégories [résolu]