Image forum décalée

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

Résolu Image forum décalée

Message par Chaw le Sam 26 Fév 2011 - 21:25

Bonsoir,
En voulant organiser les images de mon forum, je me retrouve face à un problème bien embêtant =/
L'image s'avère être décalée, et je ne sais pas comment faire en sorte qu'elle soit tout à fait alignée au cadre.


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"><div class="categories" align="right"> {catrow.tablehead.L_FORUM} </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><table class="tour" width="100%"><tr><td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
                <div class="icones"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /></div>
            </td>
            <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" align="center" width="100%" height="50">
                    <span class="forumlink"><div class="titresfora">
                        <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>

    </div>
                    </span> 
    <span class="genmed"><div class="forum-description">{catrow.forumrow.FORUM_DESC}</div>
{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
            <span class="gensmall">

                <!-- BEGIN switch_moderators_links -->
                {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
                <!-- END switch_moderators_links -->
            </span>
    </td><td valign="middle" height="50">
            <div class="forum-stats"><span class="gensmall">Messages: {catrow.forumrow.POSTS} <br/>Sujets: {catrow.forumrow.TOPICS} </span></div>

    <div class="messages"><span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
        </span>
    </td></tr></table></td>
          <!-- BEGIN forum_link_no -->
            <!-- END forum_link_no -->
            <!-- BEGIN forum_link -->
            <td class="row3" colspan="3" align="center" valign="middle" height="50"><span class="gensmall">{catrow.forumrow.forum_link.HIT_COUNT}</span></td>
            <!-- END forum_link -->
        </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 -->

Code:
    /*titre categorie*/
    .categories{
          background-color: #AD9393;
          border: 1px solid #000;
          -moz-border-radius-topleft: 14px;
          -moz-border-radius-topright: 14px;
          -webkit-border-top-right-radius: 14px;
          -webkit-border-top-left-radius: 14px;
          border-top-right-radius: 14px;
          border-top-left-radius: 14px;
          padding: 4px;
          margin-left:40%;
          margin-bottom: -2px;
          width: 50%;
          text-align: center;
          height: 14px;
          font-size: 11px;
font-family: georgia;
}

    .secondarytitle{
    background-image: none !important;}

    /*contour categorie*/
    .tour{
          background-color: #AD9393;
          -moz-border-radius: 20px;
          -webkit-border-radius: 20px;
          border-radius: 20px;
          border: 3px solid #000;}


    /*icone categorie*/
    .icones{
          background-color: #AD9393;
          -moz-border-radius: 20px;
          webkit-border-radius: 20px;
          border-radius: 20px;
          border: 1px solid #3a3a3a;
          padding: 3px;
          text-align: center;
          padding: 10px;
          height: 150px;
          width: 60px;}

    /*Titre forum*/
    .titresfora{
          background-color: #7E7167;
          border: 1px solid #7E7167;
          font-size: 11px;
          height: 14px;
          padding: 3px;
          text-align: center;
          display: block;
font-family: georgia;}

    /*description*/
    .forum-description {
          margin: auto;
          padding: 10px;
          margin: 5px;
          border: 1px dashed #fff;
          background-color: #AD9393;
          -moz-border-radius: 14px;
          -webkit-border-radius: 14px;
          font-size: 12px;
          height: 100px;
font-family: georgia;}


    /*message et sujet et dernier message*/
    .forum-stats, .messages {
          background-color: #AD9393;
          -moz-border-radius: 20px;
          -webkit-border-radius: 20px;
          border-radius: 20px;
          border: 1px solid #3a3a3a;
          padding: 3px;
          text-align: center;
          padding: 10px;
          margin: 5px;
          width: 120px;
          height: 50px;
font-family: georgia;}


/* =================
                              ===== Message d'accueil =====
        script by James1920 de CSSACTIF et LBTPROD - Novembre 13, 2010
      http://www.themes-fa.com - BY-NC  (http://creativecommons.org/licenses/by-nc/2.0/fr/)

 =================  */

 
 
  /*----------------- Ma g�n�ral ----------------- */
 

 /* Pour les défilement */
#scroller_container
{
padding-top: 15px;
overflow: hidden;
}
/* CSS Hack Safari */
#dummy
{
;#
}
#scroller_container
{
overflow: auto;
}


/*le tableau invisible */

.table25
{
border: none ;
}


/* Liens */

.a2
{
display: block;
width: 130px;
color: black;
text-align:center;
border: 1px solid black;
 -moz-border-radius: 5px;
height: 30px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
}


.a2:hover
{

background-color: black;
color: white;
}



#table22 /* fond du ma */
{
width: 770px;
background-color: #454545;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
-khtml-border-radius: 15px;
border-radius: 15px;
}




/*-----------------Titre----------------- */


/* Le titre special pour le texte de bienvenu */

.h2_themebienvenu
{
font-size: 14px;
background-color: #000;
padding: 6px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
color: white;
text-align: center;
margin: 10px;
/max-width: 367px;
}


/* le titre special pour les credits */


.h2_themecredit
{
font-size: 14px;
background-color: #000;
padding: 6px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
color: white;
text-align: center;
margin: 10px;
/max-width: 160px;
}

/* le titre pour les autres boites */



.h2_theme
{
font-size: 14px;
background-color: #000;
padding: 6px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
color: white;
text-align: center;
margin: 10px;

}


/* effet de transparance FF */

.transparence {
background-color: transparent;
border: none;
opacity: 0.5;
}

.transparence:hover{
background-color: transparent;
border: none;
opacity: 2;
}

/*-----------------Les boites contenant les textes----------------- */





/* Navigation */

 .navi_ma
 {
  background-color:#afaeae;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
color: black;
font-size: 16px;
height: 300px;
margin: 10px;
width: 130px;
padding: 5px;
line-height:34px;
-webkit-box-shadow: 4px 4px 0 #e6e6e6;
-moz-box-shadow: 4px 4px 0 #e6e6e6;
-khtml-box-shadow: 4px 4px 0 #e6e6e6;
padding-top: 20px;

}


/* News  */

 .news
 {
 background-color: #afaeae;
  -moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
color: black;
font-size: 14px;
height: 120px;
width: 160px;
margin: 10px;
overflow-y: auto;
overflow-x: visible;
padding: 5px;
-webkit-box-shadow: 4px 4px 0 #e6e6e6;
-moz-box-shadow: 4px 4px 0 #e6e6e6;
-khtml-box-shadow: 4px 4px 0 #e6e6e6;
}

/* Partenaires */

.partenaire_test
{
 background-color: #afaeae;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
color: black;
font-size: 14px;
height: 105px;
width: 160px;
margin: 10px;
padding: 5px;
-webkit-box-shadow: 4px 4px 0 #e6e6e6;
-moz-box-shadow: 4px 4px 0 #e6e6e6;
-khtml-box-shadow: 4px 4px 0 #e6e6e6; 
padding-top: 20px;

}


/* message de bienvenu */


#bienvenu_ma
{
 background-color: #afaeae;
  -moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
color: black;
font-size: 14px;
height: 120px;
margin: 10px;
overflow-y: auto;
overflow-x: visible;
padding: 5px;
-webkit-box-shadow: 4px 4px 0 #e6e6e6;
-moz-box-shadow: 4px 4px 0 #e6e6e6;
-khtml-box-shadow: 4px 4px 0 #e6e6e6;
width: 370px;
}
 
/* membres staffs */
 

 
 .staff
{
 background-color: #afaeae;
 -moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
color: black;
font-size: 10px;
height: 105px;
width: 180px;
margin: 10px;
padding: 5px;
font-size: 14px;
-webkit-box-shadow: 4px 4px 0 #e6e6e6;
-moz-box-shadow: 4px 4px 0 #e6e6e6;
-khtml-box-shadow: 4px 4px 0 #e6e6e6;
padding-top: 20px;
}


/*crédits */

 
 .credits
 {
 background-color: #afaeae;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
color: black;
font-size: 14px;
height: 105px;
width: 160px;
margin: 10px;
padding: 5px;
-webkit-box-shadow: 4px 4px 0 #e6e6e6;
-moz-box-shadow: 4px 4px 0 #e6e6e6;
-khtml-box-shadow: 4px 4px 0 #e6e6e6;
padding-top: 20px;

}




/*-----------------inffobulles----------------- */

 
div.infobulle
{
 position: relative;
 float: left;
color: black;
}

div.infobulle span
{
 display: none; /* ceci masque l'infobulle */
}
div.infobulle:hover
{
  background: none; /* correction d'un bug IE */
  z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
  color: black;
}


/* style de l infobulle */

div.infobulle:hover span
{
display: inline; /* on affiche l'infobulle */
position: absolute;
top: 10px; /* on positionne notre infobulle */
background-color: #afaeae;
color: black;
 padding: 3px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
 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é */
text-align: center;
font-size: 14px;
}

.statistiques{
border:0px;
background-image: url("LIEN IMAGE DU HAUT");
background-repeat: no-repeat;
background-position: center;
height:270px;}

.groupes{
background-color:#FFFFFF;border: 1px #D0D0D0 dotted;
-moz-border-radius : 5px 5px 5px 5px;
height:40px;padding-right:12px;padding-left:14px;padding-bottom:3px;
font-size:15px;font-weight: bold;text-align:center;
text-decoration: none !important;
margin: 15px;}

Je vous laisse le template et la feuille de style, au cas où me problème se trouverait ici.
Merci d'avance, et bonne soirée :3


Dernière édition par Chaw le Sam 26 Fév 2011 - 23:30, édité 1 fois

Chaw
Nouveau membre

Messages : 16
Inscrit(e) le : 26/02/2011

Chaw a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image forum décalée

Message par Invité le Sam 26 Fév 2011 - 23:22

Bonsoir,
C'est la dimension fixe du cadre autour des icônes qui pose soucis. Pour résoudre le problème, remplacez:
Code:
/*icone categorie*/
    .icones{
          background-color: #AD9393;
          -moz-border-radius: 20px;
          webkit-border-radius: 20px;
          border-radius: 20px;
          border: 1px solid #3a3a3a;
          padding: 3px;
          text-align: center;
          padding: 10px;
          height: 150px;
          width: 60px;}
par:
/*icone categorie*/
Code:
/*icone categorie*/
.icones{
            background-color: #AD9393;
            -moz-border-radius: 20px;
            webkit-border-radius: 20px;
            border-radius: 20px;
            border: 1px solid #3a3a3a;
            padding: 8px;
            height: 150px;
            width: auto;}

Cordialement.

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Image forum décalée

Message par Chaw le Sam 26 Fév 2011 - 23:29

Le problème est résolu, merci de votre aide, encore une fois :3

Chaw
Nouveau membre

Messages : 16
Inscrit(e) le : 26/02/2011

Chaw 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