Problèmes catégorie, image et texte.

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Problèmes catégorie, image et texte.

Message par kat-mania le Lun 8 Aoû 2011 - 0:52

@kat-mania a écrit:Bonsoir, j'ai le même objectif, mais j'ai modifié le 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}

         {CURRENT_TIME}

         </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>

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

         <!-- 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="1" cellpadding="0">
   <tr>
      <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>      <th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}</div></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"> </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>

            </span>
        </h{catrow.forumrow.LEVEL}>
        <div class="stats_cate">{catrow.forumrow.TOPICS} sujets contenant {catrow.forumrow.POSTS} messages</div>
        <div class="description">{catrow.forumrow.FORUM_DESC}</div>
        <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">
         <span class="gensmall">{catrow.forumrow.LAST_POST}</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 -->

J'aimerai quelques choses de similaire à ceci :


La taille de mes images rectangulaires font la même taille que sur l'image ci-dessus. Cependant, je n'arrive pas à mettre mon texte et mes images (carrés) comme l'exemple.



Dernière édition par kat-mania le Mar 9 Aoû 2011 - 18:13, édité 1 fois

kat-mania
***

Féminin
Messages : 168
Inscrit(e) le : 07/11/2008

http://test-fonda.forumgratuit.org/
kat-mania a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problèmes catégorie, image et texte.

Message par Threax le Lun 8 Aoû 2011 - 12:19

Bonjour,

Il suffit de mettre l'URL de l'image dans le champs "Adresse de l'image" lors de la modification d'un forum.
Le texte est simplement en justifié. Wink

Threax
+ Hyperactif +

Masculin
Messages : 17277
Inscrit(e) le : 27/08/2005

http://lesforumsde.forumactif.com
Threax a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problèmes catégorie, image et texte.

Message par kat-mania le Lun 8 Aoû 2011 - 16:16



J'ai mis mon texte en justifié et mon image, ça me donne ça :


mon css :

Code:
    .desc {
    padding: 2px;
    margin: 2px;
    background-color: #;
    border: 1px solid #FFFFFF;
    }


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:#C9043F !important; /* On force l'application de cette propriété grâce au !important */
  border-bottom:4px double #FFFFFF;
  font-weight:normal; /* Le texte non boldé */
  margin-bottom:5px; /* Pour qu'il n'y ait pas trop d'espace entre le titre et ce qu'il y a en dessous */
  }

a.forumlink:hover{
  font-variant:small-caps;
  color:#FFFFFF !important;
  border-bottom:4px double #C9043F;
  font-weight:bold; /* Texte en  gras */
  display:block;
  }


div.stats_cate{ /* La div ayant pour class 'stats_cate' */
  font-size:12px;
  text-align:right;
  border-bottom:#FFFFFF 0px solid;
  border-right:#FFFFFF 0px solid;
  font-style:italic; /* On met le texte en italic */
  color:#FFFFFF;
  padding-right:4px; /* On met un peu de remplissage pour éviter que notre bloc soit collé au bord droit de la case */
  margin-bottom:4px;
  margin-top:-22px; /* On évite de mettre un trop gros espace entre le titre et notre bloc de stats' */
  width: 500px; /* On impose une largeur pour ne pas que la bordure en bas soit sur toute la largeur de la case */
  margin-left:385px; /* On place le bloc à droite en le décallant par rapport au bord gauche de la case */
  }

div.description{  /* La div ayant pour class 'description' */
  background-color:#D4A3C0; /* On lui donne une couleur de fond */
  -moz-border-radius: 10px; /* Réglage des arrondis des coins pour mozilla */
  -webkit-border-radius: 10px; /* Réglage des arrondis des coins pour chrome et safari */
  border-radius:10px; /* réglage des arrondis des coins */
  border:1px solid #FFFFFF;
  width:300px;
  min-height:20px; /* La hauteur minimum */
  font-size:12px;
  text-align: justify;
  text-indent:6px; /* La première ligne du bloc sera décallée de 6px vers la droite */
  padding:5px;
  margin:10px;
  color:#FFFFFF;
  }


    .infobulle{position: relative;z-index: 0;}

    .infobulle:hover{background-color: transparent;z-index: 50;}

    .infobulle span{
    position: absolute;
    background-color: #000000;
    padding: 0px;
    left: -1000px;
    visibility: hidden;
    color: #FFFFFF;}

    .infobulle span img{
    border: 1px; #FFFFFF;
    padding: 0px;}

    .infobulle:hover span{
    visibility: visible;
    top: 10px;
    left: 0px;
    width: 150px;
text-align: center;
    color:#FFFFFF;
    border: 1px solid #FFFFFF;
    -moz-border-radius: 12px;
    -webkit-border-radius: 12px;
    border-radius: 12px;}



kat-mania
***

Féminin
Messages : 168
Inscrit(e) le : 07/11/2008

http://test-fonda.forumgratuit.org/
kat-mania a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problèmes catégorie, image et texte.

Message par Threax le Lun 8 Aoû 2011 - 17:46

Pourquoi donnez-vous une largeur de 300px au cadre de la description ?

Threax
+ Hyperactif +

Masculin
Messages : 17277
Inscrit(e) le : 27/08/2005

http://lesforumsde.forumactif.com
Threax a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problèmes catégorie, image et texte.

Message par kat-mania le Lun 8 Aoû 2011 - 18:41

C'est bon, j'ai trouvé.





Code:
<div style="text-align: justify;"><img alt="" src="http://images.imagehotel.net/adyirk2945.jpg" style="border: 0px solid ; margin: 3px; float: left; padding-right: 1px; width: 130px; height: 60px;" align="left">Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Vivamus rutrum hendrerit dolor. Nullam quis turpis. Proin pellentesque
pharetra risus. Praesent ornare porta metus. Suspendisse ut nulla.
Proin mauris est, auctor nec, bibendum non, vulputate vitae, ligula.
Phasellus at mi in nisi consectetur mattis. Praesent justo. Suspendisse
potenti. Proin sit amet ligula. Nullam rutrum, metus ut porta tempor,
sem mi vulputate velit, et eleifend lorem felis at justo.<br></div>



kat-mania
***

Féminin
Messages : 168
Inscrit(e) le : 07/11/2008

http://test-fonda.forumgratuit.org/
kat-mania a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum