Mes catégories sont coupées

2 participants

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

Résolu Mes catégories sont coupées

Message par Cinderella. Mer 8 Fév 2012 - 15:51

Bonjour, bonjour Smile

Un petit message pour vous faire part d'un soucis que je rencontre sur mon forum :/
J'ai dessiné un modèle de catégorie sous Photoshop que j'ai essayé de reproduire ensuite sur mon forum, en CSS et HTML.
Mais le problème c'est que mes catégories sont complètement coupées (je me débrouillerais pour les autres défauts). L'image de fond est coupée en deux et toute la partie de droite n'apparaît pas. J'ai essayé de modifier le template plusieurs fois, sans résultat probant.

Voici le problème sur mon forum (à droite) :
http://once-upon-a-time.1talk.net/

Mon 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}<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="upimg">
        <td colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%">
        <div>
          <div class="secondarytitle"> {catrow.tablehead.L_FORUM} </div>
        </div>
        </td>
        <td width="150"><div style="width:150px;"></div></td>
        </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">
                                <div class="fond-categ-gauche"><div class="imgnew" align="center"><img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" /></div>
                                  <div class="newme"><span class="gensmall" style="line-height:10px;font-family:arial;font-size:10px;">{catrow.forumrow.LAST_POST}</span></div></div>
                            </td>
                           
                           
                           
                              <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
                                        <table width="100%"><tbody><tr><td><h{catrow.forumrow.LEVEL} class="hierarchy">
                                            <span class="forumlink">
                                              <center><a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></center>
                       
                                            </span>
                                        </h{catrow.forumrow.LEVEL}></td></tr></tbody></table>
                               
                                        <table width="100%"><tbody><tr class="fond-categ-desc">
                                         
                                      <td>
                                <div class="sous-forum"><span class="gensmall">
                                  {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
                                </span></div>
                                      </td>
                                         
                                      <td>
                                        <div class="description"><span class="genmed">{catrow.forumrow.FORUM_DESC}</span><br />
                                          <img src="http://files.getwebb.org/files/33/52/2a/f6ba4148163a5d3949eb44a762c208e3f5/source.png" align="left"><center><div class="stats-sujets-msg"><span class="gensmall"><font color="#BFBD50">{catrow.forumrow.POSTS} mots dans {catrow.forumrow.TOPICS} grimoires.</font></span></div></center></div>
                                      </td>
                                         
                                          </tr></tbody></table>
                              </td>
                           
                           
                           
                              <td class="row3 over" align="center" valign="middle" height="50">
                               
                              </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://files.getwebb.org/files/c5/fd/7f/96fb0c04115642b801edf95fefc214c24e/source.png" alt="" height="150px" width="800px" /><br><br><!-- END tablefoot --><!-- END catrow -->

Mon code CSS :
Code:
.fond-categ-desc {
background-image: url("http://files.getwebb.org/files/26/64/a7/39299bed9ff5ae8af8d7a9769e679ac011/source.png");
background-repeat:no-repeat;
height: 187px;
width: 605px;}

.stats-sujets-msg {
background-color:#882F2C;
-moz-border-radius:40px;
padding:5px;
color:#BFBD50;
width:60%;
margin-right:-40px;}

.sous-forum {
  background-image: url("http://files.getwebb.org/files/81/55/1f/8e77194bf654fea09931db964e91e816a2/source.png");
margin:10px;
text-align:left;
padding:15px;}

.newme {text-align: center;
margin-left:-31px;
margin-top: -6px;
height: auto;
width: 115px;}

.description {
 margin-right:-40px;
margin:10px;
padding:25px;
text-align:justify;}

.fond-categ-gauche {
background-image: url("http://files.getwebb.org/files/34/66/be/4770d45539ca3e21c52b9d2c7471ec859e/source.png");
background-repeat:no-repeat;
margin:10xp;
padding:20px;
line-height:-5px;
width: 159px;
height: 137px;}


.imgnew {margin-top: -47px;
margin-left:-40px;
z-index: 3;
position: relative;}

.postbody {font-size:11px; padding-left:40px; padding:20px;text-align:justify;}


th {
background-image: url("http://2img.net/i/fa/empty.gif");
color: #FFA34F;
font-size: 11px;
font-weight: 700;
height: 0px;
padding: 0px 0px;}

        .nav img {
        display : none;
        }

.upimg {
background-image:url(http://files.getwebb.org/files/1a/fb/dc/969b85dd0581b78d976ad193775b42aba6/source.png);
width: 800px;
height: 150px;
z-index: 1;
  background-repeat: no-repeat ;
}

/*suppression barre noire*/

hr {
border: none;
border-top-width: 1px;
height: 0;
}

/*- seconde image -*/
.secondarytitle {
position: absolute;
z-index: 2;
margin: 16px -30px 15px;
}



.body {margin: 0px;
padding: 0px;}
             

.bodyline{

  -moz-border-radius:40px;
  -webkit-border-radius: 40px;
  -khtml-border-radius: 40px;
-moz-box-shadow: 0px 0px 7px #000000;
  background-color: #ede7d8;
  border-left: 10px solid #822a27;
    border-right: 10px solid #822a27;
  }


/*le profil*/
.cadreavatar {
background-color: white;
border : 5px solid white;
box-shadow: 1px 1px 12px #C0BFA4;}
             
.profile {
background-color: #F4F4D1;
border-top: 4px solid #E9D78F;
border-bottom: 4px solid #E9D78F;
-moz-border-radius-topleft: 90px;
-moz-border-radius-topright: 90px;
-moz-border-radius-bottomleft: 90px;
-moz-border-radius-bottomright: 90px;
padding:26px;margin:7px;}
             
.info_profil {
background-color: white;
border : 10px solid white;
line-height:0px;}

.name {font-family: 'Lobster 1.3';
font-size: 23px;
letter-spacing: 0px;}
/*le profil*/             
             

                /*boutons up/down*/
                .upbottom {
                position: fixed;
                bottom : 0px ;
                margin-left : 85% }
                /*boutons up/down*/

             
                /*bouton tv*/
                .tv {
                position: absolute;
                top : 8em ;
                margin-left :35% }
                /*bouton tv*/

       /*bouton tv*/
                .pap {
                position: absolute;
                top : 7em ;
                margin-left :67% }
                /*bouton tv*/

                /*cadre règles and co*/
             
                .cadre-fond-gauche {
                  text-align:center;
                  border-radius:30px 10px 30px 10px;
                  background-color:#E0D6CA;
                  padding:25px;
                  border: 2px #E7C4C4 solid;}
             
                .cadre-fond-droit {
                  text-align:center;
                  border-radius:10px 30px 10px 30px;
                  background-color:#E0D6CA;
                  padding:25px;
                  border: 2px #E7C4C4 solid;}
             
                .titre-cadre {
                  text-shadow:1px 1px #AAC073;
                  display:block;font-style:italic;
                  text-align:center;
                  font-family: times new roman;
                  text-transform:lowercase;
                  font-size:35px;
                  color:#ffffff;}
             
                .texte-cadre {
                  padding-left:15px;
                  padding-right:15px;
                  padding-top:-7px;
                  padding-bottom:7px;
                  text-align:justify;
                  font-family:calibri;
                  font-size:12px;
                  color:#BD8B7C;
                  text-shadow:1px 1px #ffffff;
                  overflow:auto;
                  height:180px;}
                /*cadre règles and co*/
             
             
                /*header de fond*/
                body {
                background-color: #bcbc35;
                background-image: url("http://files.getwebb.org/files/00/c4/40/06e31fc991b69d44ef6aab8f586e7bc50d/source.png");
                background-position: top center;
                background-repeat:no-repeat
                }
             
                /*arrondis zones de texte*/
             
                textarea, .textarea.post, input.post {
                -moz-border-radius:30px;
                -webkit-border-radius:30px;
        padding-left:5px;
        padding-top : 5px;
      }

                /*zones de texte*/
      .postbody {padding-top : 5px; padding-left:5px;text-align:justify;}
             
                /*arrondis zones de saisie identifiant*/
                input,textarea, select {
                -moz-border-radius: 20px;
                -webkit-border-radius: 20px;}
             
                /*soulignement des liens*/
             
                a {text-decoration: none;}
                a:link {text-decoration: none;}
                a:hover {text-decoration: none!important;}
                a.forumlink {text-decoration: none;}
                a.forumlink:hover {text-decoration: none!important;}
                a.topiclink {text-decoration: none; }
                a.topiclink:hover {text-decoration: none!important; }
             
                /*enlever dernières éditions*/
                tr.post span.gensmall { display: none; }
             
                        .catLeft, .catBottom, .catHead {
        border-width:0 0 0 0px !important;
        padding : 0px !important;
        margin : 0px !important;
        }

Un grand merci par avance, je suis perdue Sorry


Dernière édition par Cinderella. le Mer 8 Fév 2012 - 22:25, édité 1 fois
Cinderella.

Cinderella.
***

Féminin
Messages : 125
Inscrit(e) le : 13/03/2011

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

Résolu Re: Mes catégories sont coupées

Message par Anzu Mer 8 Fév 2012 - 19:55


Bonsoir,

Vos images sont trop grandes et le forum trop petit si on compare.
Si vous augmentez la largeur de votre forum, vous verrez qu'elles vont apparaître correctement mais cela va décaler le reste.
Ce sont des bidouillages à faire Smile

Cordialement.
Anzu

Anzu
Membre actif

Féminin
Messages : 20685
Inscrit(e) le : 30/08/2007

https://forum.forumactif.com/
Anzu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Mes catégories sont coupées

Message par Cinderella. Mer 8 Fév 2012 - 21:29

Merci, j'ai donc modifié la taille de mon image et cela fonctionne, mais on dirait qu'il reste un troisième colonne invisible à droite de l'image :/
Cinderella.

Cinderella.
***

Féminin
Messages : 125
Inscrit(e) le : 13/03/2011

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

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

- Sujets similaires

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