Petit soucis de placement d'une boite.. Help!

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

Résolu Petit soucis de placement d'une boite.. Help!

Message par Ectra le Dim 6 Nov - 16:24

Bonjour,

Voici un screen: http://i43.servimg.com/u/f43/12/33/79/32/screen10.jpg

Voila, vous voyez le menu de navigation? Bien. En fait il y a une partie du menu que je ne peux pas cliquer. Pourquoi? Parce qu'il est partiellement placé en dessous du bodyline.
Un screen pour que ce soit plus visible: http://i43.servimg.com/u/f43/12/33/79/32/screen11.jpg

Voila maintenant le template (je vous épargne la balise head) de haut de page et le css qui se rapport à ma navig. J'ai essayé de le placer le plus haut possible mais à l'évidence ça ne marche pas.
Code:

</head>
  <div class="navcadre">{GENERATED_NAV_BAR}</div>
 
  <body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">
   <!-- BEGIN hitskin_preview -->
   <div id="hitskin_preview" style="display: block;">
      <h1><img src="http://illiweb.com/fa/hitskin/hitskin_logo.png" alt="" /> Hit<em>skin</em>.com</h1>
      <div class="content">
         <p>
            {hitskin_preview.L_THEME_SITE_PREVIEW}
            

            <span>{hitskin_preview.U_INSTALL_THEME}<a href="http://{hitskin_preview.U_RETURN_THEME}">{hitskin_preview.L_RETURN_THEME}</a></span>
         </p>
      </div>
   </div>
   <!-- END hitskin_preview -->

   <!-- BEGIN switch_login_popup -->
   <div id="login_popup">
      <table class="forumline" width="{LOGIN_POPUP_WIDTH}" height="{LOGIN_POPUP_HEIGHT}" border="0" cellspacing="1" cellpadding="0">
         <tr height="25">
            <td class="catLeft">
               <span class="genmed module-title">{SITENAME}</span>
            </td>
         </tr>
         <tr height="{LOGIN_POPUP_MSG_HEIGHT}">
            <td class="row1" align="left" valign="top">
               <div id="login_popup_buttons">
                  <form action="{S_LOGIN_ACTION}" method="get">
                     <input type="submit" class="mainoption" value="{L_LOGIN}" />
                     <input type="button" class="mainoption" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';" />
                     <input id="login_popup_close" type="button" class="button" value="{L_DONT_DISPLAY_AGAIN}" />
                  </form>
               </div>
               <span class="genmed">{LOGIN_POPUP_MSG}</span>
            </td>
         </tr>
      </table>
   </div>
   <!-- END switch_login_popup -->

   <a name="top"></a>
   {JAVASCRIPT}
 
   <table class="bodylinewidth" width="{T_BODY_TABLE_WIDTH}" cellspacing="0" cellpadding="10" border="0" align="center">
      <tr>
         <td class="bodyline">
            <table width="100%" cellspacing="0" cellpadding="0" border="0">
               <tr>
                  <!-- BEGIN switch_logo_left -->
                  <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
                  <!-- END switch_logo_left -->
                  <td align="center" width="100%" valign="middle">
                     <!-- BEGIN switch_logo_center -->
                     <a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a>
                     

                     <!-- END switch_logo_center -->
                     <div class="maintitle">{MAIN_SITENAME}</div>
                     

                     <span class="gen">{SITE_DESCRIPTION}
  </span>
                  </td>
                  <!-- BEGIN switch_logo_right -->
                  <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
                  <!-- END switch_logo_right -->
               </tr>
            </table>

            <div style="clear: both;"></div>
                       

<div class="upandown"><table border="0" cellpadding="0" cellspacing="2"><tr><td style="text-align: center;"><a href="#top"><img class="imgupanddown" src="http://img534.imageshack.us/img534/6476/27313310.gif"></a><br>Up</td><td style="text-align: center;">Down<br><a href="#bottom"><img  class="imgupanddown" src="http://img153.imageshack.us/img153/4827/downz.gif"></a></td></tr></table></div>

            <!-- BEGIN switch_ticker_new -->
            <div id="fa_ticker_block" style="margin-top:4px;margin-bottom:4px;">
               <table width="100%" border="0" cellspacing="0" cellpadding="0" class="forumline">
                  <tr>
                     <td {CLASS_TABLE_TYPE} align="left" class="row1">
                        <div id="fa_ticker_container">
                           <ul id="fa_ticker_content" class="jcarousel-skin-tango" style="display:none;">
                              <!-- BEGIN ticker_row -->
                              <li>{switch_ticker.ticker_row.ELEMENT}</li>
                              <!-- END ticker_row -->
                           </ul>
                        </div>
                     </td>
                  </tr>
               </table>
            </div>
            <!-- END switch_ticker_new -->

            <!-- BEGIN switch_ticker -->
            <div id="fa_ticker_block" style="margin-top:4px;margin-bottom:4px;">
               <table width="100%" border="0" cellspacing="0" cellpadding="0" class="forumline">
                  <tr>
                     <td {CLASS_TABLE_TYPE} align="left" class="row1">
                        <div id="fa_ticker_container">
                           <div id="fa_ticker" style="height:{switch_ticker.HEIGHT}px;">
                              <div class="fa_ticker_content">
                                 <!-- BEGIN ticker_row -->
                                 <div>{switch_ticker.ticker_row.ELEMENT}</div>
                                 <!-- END ticker_row -->
                              </div>
                           </div>
                        </div>
                     </td>
                  </tr>
               </table>
            </div>
            <!-- END switch_ticker -->

            <div id="page-body">
               <div id="{ID_CONTENT_CONTAINER}"{CLASS_CONTENT_CONTAINER}>
                  <table cellpadding="0" cellspacing="0" width="100%" class="three-col">
                     <tbody>
                        <tr>
                           <td valign="top" width="{C1SIZE}">
                              <div id="{ID_LEFT}">
                                 <!-- BEGIN giefmod_index1 -->
                                 {giefmod_index1.MODVAR}
                                    <!-- BEGIN saut -->
                                    <div style="height:{SPACE_ROW}px"></div>
                                    <!-- END saut -->
                                 <!-- END giefmod_index1 -->
                              </div>
                           </td>
                           <td valign="top" width="100%">
<!-- BEGIN html_validation -->
                           </td>
                        </tr>
                     </tbody>
                  </table>
               </div>
            </div>
         </td>
      </tr>
   </table>
</body>
</html>
<!-- END html_validation -->
Code:
.navcadre{
width: 400px;
position: relative;
top: 335px;
left: 5px;
text-align: center;
background-color: #3c5159;
border: 1px # solid;
-moz-border-radius-topleft: 20px;
-moz-border-radius-topright: 20px;
-moz-border-radius-bottomleft: 20px;
-moz-border-radius-bottomright: 20px;
-webkit-border-top-left-radius: 20px;
-webkit-border-top-right-radius: 20px;
-webkit-border-bottom-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-khtml-border-top-left-radius: 20px;
-khtml-border-top-right-radius: 20px;
-khtml-border-bottom-left-radius: 20px;
-khtml-border-bottom-right-radius: 20px;
opacity: 0.6;
-moz-opacity: 0.6;
-khtml-opacity: 0.6;
box-shadow: 3px 3px 3px #000000;}

a.mainmenu img {
display:none;}

a.mainmenu{
font-family: Verdana;
padding-left:2px;
padding-right:2px;}

a.mainmenu:hover {
font-style: italic;}

Donc voila ma question. Est-ce que quelqu'un pourrait m'aider ou aurait une idée pour que je puisse cliquer la totalité de ma navig.. En gros, une idée pour qu'elle soit au dessus du reste =) J'ai une solution de substitution qui est de réduire la largeur pour qu'elle n'empiète pas sur le bodyline mais bon.. ça sera le dernier recours!
Merci à ceux qui essayeront =D


Dernière édition par Ectra le Mer 9 Nov - 15:40, édité 1 fois

Ectra
Nouveau membre

Messages : 27
Inscrit(e) le : 25/04/2011

http://charmed.forumactif.org
Ectra a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Petit soucis de placement d'une boite.. Help!

Message par Ectra le Mar 8 Nov - 19:24

Up!! (pas taper! pas taper!)

Ectra
Nouveau membre

Messages : 27
Inscrit(e) le : 25/04/2011

http://charmed.forumactif.org
Ectra a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Petit soucis de placement d'une boite.. Help!

Message par diedblack le Mer 9 Nov - 1:04

J'aurait une idée (simplement une idée)
Mettre la priorité d'affichage à la barre de navigation.
Je sait pas trop mais j'ai en tête quelque chose comme
Priority="absolute"

Je sait pas si ce code marche ^^ mais quelque chose du genre.

EDIT: à faire à partir du CSS je crois.

diedblack
****

Masculin
Messages : 206
Inscrit(e) le : 09/04/2011

http://www.frsociety.com
diedblack a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Petit soucis de placement d'une boite.. Help!

Message par Ectra le Mer 9 Nov - 1:11

Non, ça ne marche pas (j'ai testé dans la fiche css et directement dans le template)
Merci quand même =D

C'est fou ça, pourtant le code de la navig est placé au dessus le code du bodyline, ça devrait du coup se retrouver par dessus normalement nan?

Ectra
Nouveau membre

Messages : 27
Inscrit(e) le : 25/04/2011

http://charmed.forumactif.org
Ectra a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Petit soucis de placement d'une boite.. Help!

Message par diedblack le Mer 9 Nov - 14:06

Non c'est pas vraiment comme sa que sa fonctionne, le code ayant une priorité d'affichage a le dessus je crois, il doit exister des codes pouvant donner une priorité à un élément, juste rechercher sur internet Wink

diedblack
****

Masculin
Messages : 206
Inscrit(e) le : 09/04/2011

http://www.frsociety.com
diedblack a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Petit soucis de placement d'une boite.. Help!

Message par Ectra le Mer 9 Nov - 15:40

Wouhouuu j'ai trouvé!

Alors en fait, le principe de priorité oui ca existe, c'est le code z-index
Du coup j'ai mis z-index: 1; à ma naviv et z-index: 2; à mon body, du coup la navig est placé au dessus du body et j'ai accés total à ma navig =D
Et ça marche sur Google chrome, mais aussi sur Firefox. (j'ai bannis IE de mon ordi donc je sais pas pour lui par contre)

Du coup si d'autres cherchent une solution à ce problème, elle est là =D
Merci quand même Dieldblack ^^

Ectra
Nouveau membre

Messages : 27
Inscrit(e) le : 25/04/2011

http://charmed.forumactif.org
Ectra 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