Sujets similaires

Bonjour/Bonsoir à tous ^-^

Tout d'abord, j'espère que je ne fais pas de bêtise en postant ici... j'ai cherché partout sur le forum de quoi régler mon problème mais même après l'avoir passé au peigne fin, je n'ai rien trouvé qui puisse me sauver :/

Voilà donc ce qui m'embête : j'ai placé ma barre de navigation au dessus de ma bannière. Le problème demeure le suivant : la barre reste SUR la bannière, au lieu d'être tout à fait au dessus (exemple : https://2img.net/h/oi56.tinypic.com/bg1iqq.jpg)
J'aimerais savoir comment décaller ma bannière (ainsi que la bordure du forum qui l'entoure) vers le bas, de façon à ce que ma barre de navigation se retrouve bien en haut, et non pas SUR ma bannière ^-^

j'espère avoir été claire :/ je peux bien évidemment vous donner mon html ou css si besoin est =)

Merci beaucoup

Salut! Oui je crois que ton template overall-header serait utile Wink

Oui, bien sûr ^-^

Code:: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}" xml:lang="{L_LANG_HTML}" xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>


<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

<title>{SITENAME_TITLE}{PAGE_TITLE}</title>
<meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-style-type" content="text/css" />
{META_FAVICO}
{META}
<meta name="title" content="{SITENAME_TITLE}{PAGE_TITLE}" />
{T_HEAD_STYLESHEET}
{CSS}
<link rel="search" type="application/opensearchdescription+xml" href="/improvedsearch.xml" title="{SITENAME}" />
<link rel="search" type="application/opensearchdescription+xml" href="{URL_BOARD_DIRECTORY}/search/improvedsearch.xml" title="{SEARCH_FORUMS}" />
<script src="{JQUERY_PATH}" type="text/javascript"></script><script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script>

<script src="{JS_DIR}jquery/ticker/ticker.js" type="text/javascript"></script>
<link type="text/css" rel="stylesheet" href="{JS_DIR}jquery/ticker/ticker.css" />

<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){
   
      pm = window.open('{U_PRIVATEMSGS_POPUP}', '_faprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');
      pm.focus();
   
   
      report = window.open('{switch_report_popup.U_REPORT_POPUP}', '_phpbbreport', 'HEIGHT={switch_report_popup.S_HEIGHT},resizable=yes,scrollbars=no,WIDTH={switch_report_popup.S_WIDTH}');
      report.focus();
   
   
      ticker_start({switch_ticker.HEIGHT}, {switch_ticker.SPACING}, {switch_ticker.SPEED}, '{switch_ticker.DIRECTION}', {switch_ticker.STOP_TIME});
   
});


   var logInPopUpLeft, logInPopUpTop, logInPopUpWidth = {LOGIN_POPUP_WIDTH}, logInPopUpHeight = {LOGIN_POPUP_HEIGHT}, logInBackgroundResize = false, logInBackgroundClass = false;

//]]>
</script>

{GREETING_POPUP}

<style type="text/css">
#hitskin_preview {
   margin: 0; padding: 0;
   position: fixed;
   top: 0; left: 0;
   width: 100%;
   height: 65px;
   background: url('http://2img.net/i/fa/hitskin/hitskin_bar.png') repeat-x left -15px;
   color: #fff;
}
* html #hitskin_preview { /* Fix for IE6 since it doesn't implement fixed positionning */
   position: absolute;
   top:expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop : document.body.scrollTop);
   z-index: 2;
   background: transparent url('http://2img.net/i/fa/hitskin/hitskin_bar-ie6.gif') repeat-x left -15px;
}
* html { /* Gunlaug's Speed fix for the above positionning fix. Sorry for the fix for the fix */
background: #fff url(foo) fixed;
}
#hitskin_preview h1 {
   float: left;
   margin: 3px 0 0 0;
   padding: 0 0 0 10px;
   font: italic normal 25px Arial,sans serif;
   color: #fff;
}
#hitskin_preview h1 img {
   vertical-align: middle;
}
#hitskin_preview em {
   color: #7CBA2C;
   font-weight: bold;
}
#hitskin_preview a {
color: #fff;
}
#hitskin_preview a:hover {
text-decoration: underline;
}

#hitskin_preview .content {
   text-align: right;
}
#hitskin_preview .content p {
   margin: 4px 1em 0px 1em;
   font-size: 13px;
   line-height: 1.8em;
   color: #fff;
   font-weight: bold;
}
#hitskin_preview .content p span {
   font-weight: normal;
   font-size: 0.8em;
}
body {
   margin-top: 40px !important;
}
{hitskin_preview.HITSKIN_RTL_CSS}
</style>

</head>
<body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">

<div id="hitskin_preview" style="display: block;">
   <h1><img src="http://2img.net/i/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>



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


<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 cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
            <tr>
               <td align="{MENU_POSITION}"{MENU_NOWRAP}><span class="navi">{GENERATED_NAV_BAR}</span></td>
</tr>
</table><br>

         <table width="100%" cellspacing="0" cellpadding="0" border="0">
            <tr>
               
               <td><a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
               <td align="center" width="100%" valign="middle">
                  <div class="maintitle">{MAIN_SITENAME}</div>


                  <span class="gen">{SITE_DESCRIPTION}
</span>
               </td>
               

               
               <td align="center" width="100%" valign="middle">
                  <a href="{U_INDEX}"><img src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1" /></a>

                  <div class="maintitle">{MAIN_SITENAME}</div>


                  <span class="gen">{SITE_DESCRIPTION}</span>
               </td>
               

               
               <td align="center" width="100%" valign="middle">
                  <div class="maintitle">{MAIN_SITENAME}</div>


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



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

         
         <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">
                              
                              <div>{switch_ticker.ticker_row.ELEMENT}</div>
                              
                           </div>
                        </div>
                     </div>
                  </td>
               </tr>
            </table>
         </div>
         

         <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}">
                              
                              {giefmod_index1.MODVAR}
                                 
                                 <div style="height:{SPACE_ROW}px"></div>
                                 
                              
                           </div>
                        </td>
                        <td valign="top" width="100%">

                        </td>
                     </tr>
                  </tbody>
               </table>
            </div>
         </div>
      </td>
   </tr>
</table>
</body>
</html>

le voici =)

Le problème n'est pas là je crois, alors je pourrais avoir ton CSS aussi stp ^^?

Code:: a.forumlink:link, a.forumlink:visited {
-moz-border-radius-bottomleft:6px;
-moz-border-radius-bottomright:6px;
-moz-border-radius-topleft:6px;
-moz-border-radius-topright:6px;
background-color:#C9C5A0;
border-left:9px solid a { text-decoration: none; };
border-right:9px solid #C9C5A0;
}
body { background-attachment: fixed; background-repeat: no-repeat; background-position: top center;}
.mainmenu{ background-color: #E9E7D8; font-size : 11px; color : #680001 }a.mainmenu{ background-color: #E9E7D8; text-decoration: none; color : #680001;}a.mainmenu:hover{ background-color: #E9E7D8; text-decoration: none; color : #B00000; }

/* ********************TAILE DES POLICES DANS LES POSTS ****************** */
.postbody {
background-color:#B9D3DE;
font-size:14px;
line-height:21px;
letter-spacing:normal;
text-align:justify;
text-indent:length;
}

body {
background-color: #B9D3DE;
background-image: url("http://i52.tinypic.com/jq6beq.jpg");
background-attachment: scroll;
background-repeat: no-repeat;
background-position: top center;
margin-left: 30px;
}

.bodyline {
border: solid 20px #000000;
-moz-border-radius: 8px ;
-webkit-border-radius: 8px;
margin-top: 20px;
padding-top: 20px;

}

a:link {color: #EDD096; text-decoration: none; font-weight:none; }
a:visited {color: #EDD096; text-decoration: none; font-weight:none;}
a:hover {color: #EDD096; text-decoration: none !important;
}

u{border-bottom: 1px dotted; text-decoration: none;}

.postdetails.poster-profile a img {
margin: auto;
display: block;
margin-bottom: 0px;
}

/***blockquote****/
tr.post td {padding-left: 0px;
padding-right: 0px;}

.lock {
position: relative;
cursor: pointer;
}
.lock .lock-hidden {
/* positionnement du bloc qui apparait */
display: none;
position: absolute;
top: 0px;
left: 80px;

/* style du bloc qui apparait */
border: 5px ridge #808080;
border-radius: 0px;
background-image: url("http://i1032.photobucket.com/albums/a410/NocturnaMew/Russian%20Silence/th_fondcategorie.png");
width: 180px;
height: 120px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
text-align: center;
}
.lock:hover .lock-hidden {
display: block;
}

.illies {
position: relative;
cursor: pointer;
}
.illies .illies-hidden {
/* positionnement du bloc qui apparait */
display: none;
position: absolute;
top: -50px;
left: 80px;

/* style du bloc qui apparait */
border: 5px ridge #808080;
border-radius: 0px;
background-image: url("http://i1032.photobucket.com/albums/a410/NocturnaMew/Russian%20Silence/th_fondcategorie.png");
width: 180px;
height: 120px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
text-align: center;
}
.illies:hover .illies-hidden {
display: block;
}

.jerem {
position: relative;
cursor: pointer;
}
.jerem .jerem-hidden {
/* positionnement du bloc qui apparait */
display: none;
position: absolute;
top: 0px;
left: -190px;

/* style du bloc qui apparait */
border: 5px ridge #808080;
border-radius: 0px;
background-image: url("http://i1032.photobucket.com/albums/a410/NocturnaMew/Russian%20Silence/th_fondcategorie.png");
width: 180px;
height: 120px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
text-align: center;
}
.jerem:hover .jerem-hidden {
display: block;
}

.lea {
position: relative;
cursor: pointer;
}
.lea .lea-hidden {
/* positionnement du bloc qui apparait */
display: none;
position: absolute;
top: -50px;
left: -190px;

/* style du bloc qui apparait */
border: 5px ridge #808080;
border-radius: 0px;
background-image: url("http://i1032.photobucket.com/albums/a410/NocturnaMew/Russian%20Silence/th_fondcategorie.png");
width: 180px;
height: 120px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
text-align: center;
}
.lea:hover .lea-hidden {
display: block;
}

/**BORDS ARRONDIS DANS LES MESSAGES AU MOMENT DE POSTER**/
textarea, .textarea.post, input.post {
-moz-border-radius:10px;
}

#chatbox_header .catBottom .cattitle {
color: #000000;}

#chatbox_header .chatbox-options .genmed,
#chatbox_header .chatbox-options,
#chatbox_header .chatbox-options a {
color: #000000;}

.mystats_fa{
padding: 5px;
text-align:center;
font-family: georgia;
font-size: 12px;
text-shadow: 5px 5px 5px #000000;
font-style: italic;
}

.name {
text-shadow: 5px 5px 5px #000000;
text-align:center;
font-weight: normal !important;
}

.forumline{
background-color: #220011;
-moz-border-radius: 8px ;
border: 5px #000000 solid;
-webkit-border-radius: 8px;
}

.statistiques{
border:0px;
background-color: #B9D3DE;
background-image: url("http://i1032.photobucket.com/albums/a410/NocturnaMew/Alice/quiestenligne.png");
background-repeat: no-repeat;
background-position: center;
height:270px;
}

.postdetails.poster-profile a img
{
border: 5px solid #808080; /*La bordure*/
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 8px;
-moz-border-radius-bottomright: 8px;
-moz-border-radius-bottomleft: 8px;
}

.arrondi {
width:100px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
background-color: #440022;
border: 2px outset #808080;
margin-left:10px;
margin-right:10px;
padding:10px;
text-shadow: black 5px 5px 5px;
text-transform : uppercase;
}

a.forumlink:link, a.forumlink:visited {
font-family: georgia;
text-transform : uppercase;
text-align: center;
font-size: 100%;
border-bottom: 5px solid #440022;
color: #404040;
letter-spacing: 1px;
display: block;
-moz-border-radius:10px;
}
a.forumlink:hover, a.forumlink:hover:visited {
background-image: url("url de votre image");
color: #808080;
text-align: center;
display: block;
border-bottom: 5px solid #440022;
-moz-border-radius:10px;
}

/***********************************************
* Gradual Element Fader- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use
***********************************************/

.petitecateg {
filter:alpha(opacity=50);
-moz-opacity:0.5;opacity: 0.5;
color:#808080;
text-shadow: black 10px 10px 10px;
}

.petitecateg:hover {
filter:alpha(opacity=100);
color:#808080;
-moz-opacity:1;opacity: 1;
text-shadow: black 10px 10px 10px;
}

.categ {
font-family: georgia;
text-transform : uppercase;
text-align: center;
font-size: 22px;
color: #000000;
letter-spacing: 1px;
display: block;
-moz-border-radius:10px;
}

.vignettes
{-moz-border-radius:3px;
background-color: #440022;
padding-right:10px;
color: #000000;
padding-left:10px;
padding-bottom: 2px;
padding-top:2px;}

.description
{-moz-border-radius:8px;
background-color: #440022;
padding-right:10px;
color: #000000;
text-align: center;
padding-left:10px;
padding-bottom: 2px;
padding-top:2px;}

.QEEL {
-moz-border-radius:8px;
border: solid 5px #000000;
background-color: #440022;
padding-right:10px;
padding-left:10px;
padding-bottom: 2px;
padding-top:2px;
width: 600px;
text-align:justify;
}

.gensmall {
font-weight:none;
color:#808080;
}

.couleurlegende {
font-weight:none;
color:#000000;
font-size:12px;
}

.fondco {
background-color:#77bb44;
}

.titreonglet {
text-transform : uppercase;
color:#808080;
}

.titreonglet:hover {
text-transform : uppercase;
color:#EDD096;
}

.titresPA {
font-family: georgia;
background-color:#2C4F57;
color:#000000;
text-align: center;
font-weight:bold;
text-transform : uppercase;
font-size:20px;
}

.admin{
text-align: justify;
font-size:11px;
text-shadow: 5px 5px 5px #000000;
color:#808080;
}

.navigpa{
text-transform : uppercase;
text-shadow: 5px 5px 5px #000000;
font-size:18px;
color:#808080;
font-family: georgia;
}

.navigpa:hover{
color:#EDD096;
text-transform : uppercase;
font-family: georgia;
font-size:18px;
}

.pouet{
text-align: justify;
font-size:12px;
text-shadow: 5px 5px 5px #000000;
color:#808080;
}

.T{
text-align: justify;
font-size:32px;
text-shadow: 5px 5px 5px #000000;
color:#808080;
}

.T:hover{
text-align: justify;
font-size:32px;
text-shadow: 5px 5px 5px #000000;
color:#EDD096;
}

.pouetcentré{
text-align: center;
font-size:12px;
text-shadow: 5px 5px 5px #000000;
color:#808080;
}

.content{
background-color: #440022; /*background color of content*/
color: #000000; /*text color of content*/
border: 0px solid #808080; /*border color*/
padding: .5em 2ex;
}

.onglet
{ display:inline-block;
margin-left:10px;
margin-right:10px;
padding:10px;
border:2px outset #808080;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
cursor:pointer;
}

.onglet_0
{
background:#0B0C14;
border-bottom:2px solid #808080;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
color:#401100;
}

.onglet_1
{
background:#0B0C14;
border-bottom:2px solid #808080;
padding-bottom:10px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
color:#000000;
}

.contenu_onglet
{
background-color:#0B0C14;
border:2px outset #808080;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
color:#000000;
margin-top:10px;
margin-left:10px;
margin-right:10px;
padding:10px;
display:none;
width: 860px;
height: 520px;
}

.navi {
background-color: #4ba291; /*FOND*/
border: 1px solid #37bcd9;
text-shadow: 0px 0px 3px #000000; /*OMBRAGE*/
padding: 3px; /*ESPACER DES BORDS*/
-moz-border-radius: 5px; /*ARRONDIR LES COINS*/
}

/*QEEL onglets*/

ul, li{
list-style: none;
}
.mon_onglet{
float: left;
padding: 2px 10px;
margin-right: 5px;
color: #333;
background: #d8f8ca;
border: 1px solid #68ce3e;
cursor: pointer;
margin-bottom: -1px;
}
.mon_onglet:hover{
background: #b8efa1;
}
.mon_onglet_selected{
float: left;
padding: 2px 10px;
margin-right: 5px;
color: #333;
background: #b8efa1;
border-top: 1px solid #68ce3e;
border-right: 1px solid #68ce3e;
border-left: 1px solid #68ce3e;
border-bottom: 1px solid #b8efa1;
cursor: pointer;
margin-bottom: -1px;
}
.clear{
clear: both;
}
.mon_contenu{
color: #666;
background: #b8efa1;
border: 1px solid #68ce3e;
padding: 10px;
}
#mes_contenus, #mes_onglets{
width: 400px;
}

voicii ^^ en vous remerciant d'avance ^-^

Je ne crois pas que le problème vienne de là non plus :/ Tu pourrais me donner le lien vers ton forum? Avoir un visuel complet ça aide souvent à cerner le problème Razz

http://beyondthemirror.forumactif.org/

et voici =) évidemment, il est tout juste en construction Razz

Code:: .navi {
position: absolute;
top: 0px;
background-color: #4ba291; /*FOND*/
border: 1px solid #37bcd9;
text-shadow: 0px 0px 3px #000000; /*OMBRAGE*/
padding: 3px; /*ESPACER DES BORDS*/
-moz-border-radius: 5px; /*ARRONDIR LES COINS*/
}

Bonjour

Merci beaucoup, mon problème est ENFIN résolu ! I love you

Parfait!

Je classe

Problème : barre de navigation au dessus de la bannière [résolu]

Problème : barre de navigation au dessus de la bannière [résolu]

Sujets similaires

Sujets similaires

Partenaires Or