Code catégorie

[tara62143]

Bonjour,

voilà après mainte recherche j'ai trouvé comment mettre une image au dessus de mes sujets, seul petit hic, les liens se trouvent au dessus de l'image, comment faire pour les mettre dedans ?

Mon template topics_list_box:

Spoiler:

Exemple:

Spoiler:

Merci d'avance .

[tara62143]

Up please

[tara62143]

up

[SoraNoHime]

Bonjour

pourrai-je avoir la css associée à votre template que je suis tester le rendu et essayer des solutions ?

Cordialement.

[tara62143]

Oui bien sur le voici :

Code:

#i_logo {
        margin-top: -18px;
        margin-bottom: 0px;
        }

#forumm {
margin-left : 200px;
padding-right : 0px;
}

.accToggler{
margin: 3px auto;
padding: 3px;
width: 400px;
background: #acc95f;
color: #f4f4f4;
border: 1px solid #fff;
cursor: pointer;
}

.accContent{
margin: 0px auto;
width: 400px;
}

body {
 
    background-color: #e3ccc9;
  background: url('http://img15.hostingpics.net/pics/986200fond2.png') top center;
  background-repeat: repeat-y;
  margin-left:8px;
  }

div#background2{
      width: 100%; height: 100%;
      margin: 0px; padding: 0px;
  margin-top: -10px;
  background: transparent url('http://img15.hostingpics.net/pics/486213fond1.png') top center no-repeat;}


.img_haut{background: url(http://img15.hostingpics.net/pics/152854hautpage2.png);
  background-position: center;
  width: 846px; height: 161px;
  background-repeat: no-repeat;
}


.forumline{
border-right:5px solid #5b3f09;
border-left:5px solid #5b3f09;
border-bottom:5px solid #5b3f09;
          -moz-border-radius:10px;
        -webkit-border-radius:10px;
        -ô-border-radius:10px;
        -khtml-border-radius:10px;
        border-radius:10px;
        }


        .eclairci
        {
        filter:alpha(opacity=70);
  -moz-opacity:0.7;opacity: 0.7;
        }
       
        .eclairci:hover
        {
        filter:alpha(opacity=100);
  -moz-opacity:1;opacity: 1;
        }

        a:hover{
        text-decoration: none !important;
        }
       
        a {
        text-decoration: none !important;
        }
       
        a:link {
        text-decoration: none;
        }
       
        a:visited {
        text-decoration: none;
        }

a.forumlink:link, a.forumlink:visited {
font-family: Palatino Linotype;
font-size:28px;
font-style: italic;
color: #492c11;
display: block;
margin-left:10px;
text-shadow: #1A1918 0px 0px 10px;
margin-bottom:-10px;
font-weight: normal;
letter-spacing:-1px;
}

#nbrmess {
  font-family: Palatino Linotype;
font-size:15px;
color: #492c11;
display: block;
margin-left:10px;
text-shadow: #a58e79 0px 0px 5px;
margin-bottom:-10px;
font-weight: normal;
letter-spacing:-1px;
}

#qeel {
  background: url(http://img11.hostingpics.net/pics/375836qeel.png);
  background-position: center;
  width: 846px; height: 475px;
}

#groupe {
        margin-top: 198px;
        margin-left: 65px;
}

#message {
  margin-top: 15px;
  margin-left: 65px;
  text-align: center;
}

a.mainmenu img {
display:none;
}

a.mainmenu{
    text-decoration:none;
        padding: 5px 5px;
        margin: 5px;
        background: #604b39;
  font-family: Palatino Linotype;
  letter-spacing:1px;
        color: #301c0a;
        border: 1px solid #735c47;
        -moz-border-radius: 15px 0 15px 0;
        -webkit-border-radius: 15px 0 15px 0;
        border-radius: 15px 0 15px 0;
}

a:hover.mainmenu{
    text-decoration:none;
        padding: 5px 5px;
        margin: 5px;
        background: #000;
  font-family: Palatino Linotype;
  letter-spacing:1px;
        color: #301c0a;
        border: 1px solid #87694e;
background: url(http://img11.hostingpics.net/pics/338431pattern.png);
}

#page-body {
margin-top:15px;
}

        /*poster-profile*/
/*pseudo*/
div.post-pseudo, span.name a {
font-size: 12px;
margin-bottom: 0px; /*positionnement du pseudo par rapport au haut du cadre-avatar*/
padding: 4px 7px 0px 0px; /*dans le sens des aiguilles d'une montre : top > right > bottom > left*/
font-family: Palatino Linotype;
font-size:18px;
text-shadow: #1A1918 0px 0px 10px;
letter-spacing:1px;
text-align: center;
}
/*avatar*/
div.post-avatar img {
width: 200px;
height: 300px;
border: 2px solid #5c410a;
background: #5a3e08;
-moz-border-radius: 5px; /*arrondis pour FF*/
-webkit-border-radius: 5px; /*arrondis pour autres navigateurs*/
border-radius: 5px; /*arrondis pour Opera*/
padding: 5px;
}
/*rang*/
div.post-rank {
font-family: Palatino Linotype;
font-size: 12px;
margin-top: -4px; /*positionnement du rang par rapport au bas du cadre-avatar*/
propriétés couleurs de fond, texte, etc;
padding: 6px;
margin-top: 4px;
border: 2px solid #5c410a;
background: #614c22;
-moz-border-radius: 5px; /*arrondis pour FF*/
-webkit-border-radius: 5px; /*arrondis pour autres navigateurs*/
border-radius: 5px; /*arrondis pour Opera*/
}
/*infos-profil*/
div.post-profil-infos {
  font-family: Palatino Linotype;
  margin-top: 4px;
border: 2px solid #5c410a;
background: #614c22;
-moz-border-radius: 5px; /*arrondis pour FF*/
-webkit-border-radius: 5px; /*arrondis pour autres navigateurs*/
border-radius: 5px; /*arrondis pour Opera*/
}
/*bouton show-mask*/
.rpgbutton {
propriétés couleurs de fond, radius, texte, espacement (padding), etc;
}
/*contenu-feuille-rpg*/
.rpgcontent {
text-align: center;
font-size: ?px;
}

a.nav img
{
width: 200px;
}

[SoraNoHime]

En fait ces liens se trouvent dans un autre template : viewforum_body

il s'agit de cette partie :

Code:

<table width="100%" border="0" cellspacing="2" cellpadding="0" align="center">
   <tr>
      <td align="left" valign="middle" width="50">
         <!-- BEGIN switch_user_authpost -->
         <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" id="{POST_IMG_ID}" alt="{L_POST_NEW_TOPIC}" border="0" /></a>
         <!-- END switch_user_authpost -->
      </td>
      <td class="nav" valign="middle" width="100%"><div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div></td>
      <td class="gensmall" align="right" valign="bottom" nowrap="nowrap">
         <span class="nav">
            <script type="text/javascript">//<![CDATA[
               var url_newposts = '{U_NEWPOSTS_JS_PLUS_MENU}';
               var url_egosearch = '{U_EGOSEARCH_JS_PLUS_MENU}';
               var url_unanswered = '{U_UNANSWERED_JS_PLUS_MENU}';
               var url_watchsearch = '{U_WATCHSEARCH_JS_PLUS_MENU}';
               var url_tellfriend = '{U_TELLFRIEND_JS_PLUS_MENU}';
               insert_plus_menu('f{FORUM_ID}&amp;f={FORUM_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES});
            //]]>
            </script>
         </span>
      </td>
   </tr>
</table>

il vous suffit de placer une div autour de cette partie. <div id="linkreply"> la partie concernée</div>

puis de mettre dans votre css :

Code:

#linkreply {
position : relative ;
top : 150px;
max-width : 500px;
}

position : relative permet le déplacement.

top : 150px indique qu'on le déplace de 150 pixel d'en haut à partir de sa position initiale

max-width ; 500 px, vous permet de réduire la taille que prend cette partie en largeur.

Je vous laisse régler les détails du positionnement.

Cordialement

[tara62143]

Je pouvais chercher longtemps. Merci beaucoup pour ta réponse