Sujets similaires

Dernière édition par sunn-shiinex le Mer 02 Mar 2011, 19:06, édité 1 fois

Bonjour, J'ai un petite problème. J'arrive pas a ce que ma barre de navigation prennent tout la largeur de mon forum? (la largeur de la bannière & le contour inclus).
Barre de navigation 610

voila mon template Overall_Header que j'ai modifier:

Code:: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}" xml:lang="{L_LANG_HTML}" {NAMESPACE_FB_LIKE} {NAMESPACE_FB}>
<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" />

<link rel="canonical" href="{switch_canonical_url.CANONICAL_URL}" />

{META_FAVICO}
{META}
{META_FB_LIKE}
<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="http://connect.facebook.net/{switch_fb_login.FB_LOCAL}/all.js" type="text/javascript"></script>
<script src="{switch_fb_login.JS_FB_LOGIN}" type="text/javascript"></script>



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



<script src="{JS_DIR}jquery/jcarousel/jquery.jcarousel.js" type="text/javascript"></script>
<script type="text/javascript">//<![CDATA[
/* Definir le sens de direction en fonction du panneau admin */
var tickerDirParam = "{switch_ticker.DIRECTION}";
var slid_vert = false;
var auto_dir = 'next';
var h_perso = parseInt({switch_ticker.HEIGHT});

switch( tickerDirParam )
{
case 'top' :
slid_vert = true;
break;

case 'left':
break;

case 'bottom':
slid_vert = true;
auto_dir = 'prev';
break;

case 'right':
auto_dir = 'prev';
break;

default:
slid_vert = true;
}

$(document).ready(function() {
var w_cont = $('#fa_ticker_container').width();

if (w_cont > 0)
{
$('#fa_ticker_container').width(w_cont);

/* Affichage de la liste */
$('#fa_ticker_content').css('display','block');

/* Calcul des dimensions du conteneur et des �l�ments */
var width_max = $('ul#fa_ticker_content').width();
var width_item = Math.floor(width_max / {switch_ticker.SIZE});
var height_max = h_perso;

/* Calcul de la hauteur maximale du contenur en fonction des �l�ments et de la hauteur personnalis�e dans l'admin */
$('ul#fa_ticker_content li').each( function () {
if ($(this).height() > height_max)
{
height_max = $(this).height();
}
} );

/* Redimensionnement des �l�ments et des images trop larges */
$('ul#fa_ticker_content li').width(width_item).height(height_max).find('img').each(function () {
if ($(this).width() > width_item)
{
var ratio = $(this).width() / width_item;
var new_height = Math.round($(this).height() / ratio);
$(this).height(new_height).width(width_item);
}
});

/* Redimensionnement et centrage du conteneur en mode vertical */
if (slid_vert)
{
$('ul#fa_ticker_content').width(width_item).height(height_max).css('marginLeft','auto').css('marginRight','auto');
}

/* Initialisation du caroussel */
$('#fa_ticker_content').jcarousel({
vertical: slid_vert,
wrap: 'circular',
auto: {switch_ticker.STOP_TIME},
auto_direction: auto_dir,
scroll: 1,
size: {switch_ticker.SIZE},
height_max: height_max,
animation: {switch_ticker.SPEED}
});
}
else
{
$('ul#fa_ticker_content li:not(:first)').css('display','none');
$('ul#fa_ticker_content li:first').css('list-style','none').css('text-align','center');
}
});
//]]>
</script>


<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 = true, logInBackgroundClass = false;



$(document).ready( function() {
$(window).resize(function() {
var windowWidth = document.documentElement.clientWidth;
var popupWidth = $("#login_popup").width();
var mypopup = $("#login_popup");

$("#login_popup").css({
"left": windowWidth/2 - popupWidth/2
});
});
});

//]]>
</script>
{GREETING_POPUP}

<style>
.jcarousel-skin-tango .jcarousel-item {
text-align:center;
width: 10px;
}

.jcarousel-skin-tango .jcarousel-item-horizontal {
margin-right: {switch_ticker.SPACING}px;
}

.jcarousel-skin-tango .jcarousel-item-vertical {
margin-bottom: {switch_ticker.SPACING}px;
}
</style>



<script type="text/javascript">
//<![CDATA[
var _gaq = _gaq || [];
_gaq.push(['_setAccount', '{G_ANALYTICS_ID}']);
_gaq.push(['_trackPageview']);

(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
//]]>
</script>

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

<center><td width="758px"align="{MENU_POSITION}"{MENU_NOWRAP}><span class="navi">{GENERATED_NAV_BAR}</span></td></center>

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

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


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

<li>{switch_ticker.ticker_row.ELEMENT}</li>

</ul>
</div>
</td>
</tr>
</table>
</div>



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

Et mon css:

Code:: .maintitle{
margin-top:0px;
}
a.mainmenu{
margin: -5px;
padding-right: 10px;}

.mainmenu {width: 758px; margin: 0px; border: 0px solid #96b6bb;-moz-border-radius: 10px; -webkit-border-radius: 10px; padding: 5px; background-color:#ffffff ; font-size: 11px position: absolute; }

.forumlink{
text-align: center;
align: center;}

a.mainmenu{
text-decoration: none;
color : #FFFFFF;
}

a.forumlink{
border-bottom: 1px dashed #96b6bb;
color:#96b6bb;
text-color:#96b6bb;
font-size: px;
display:block;

}
a.forumlink:hover{
border-bottom: 1px dashed #644d46;
color:#644d46;
font-size: px;
display:block;
}

a.mainmenu:hover{
text-decoration:none;
color : #000000;
}

.bodyline{
border:6px solid;
color : #96b6bb;

}

.postdetails.poster-profile a img
{
border: 6px solid /*La bordure*/
}

.milieu {width: 90%; margin: 2px; border: 3px solid #96b6bb;-moz-border-radius: 10px; -webkit-border-radius: 10px; padding: 5px; background-color:#ffffff ; font-size: 11px}

.crochet {
background-image: url('http://i51.tinypic.com/14o3ur5.png'); /*--- Image de la corbeille ---*/
background-repeat: no-repeat; /*--- On ne fait apparaître l'image qu'une seule fois ---*/
background-position: center left; /*--- On positionne notre corbeille au milieu à gauche ---*/
background-color: #f7f7f7; /*--- Couleur de fond ---*/
border: 1px solid #000000; /*--- Taille, type et couleur de la bordure ---*/
color: #000000; /*--- Couleur du texte ---*/
padding-left: 80px; /*--- On espace la bordure gauche du texte de 55px ---*/
min-height: 75px; /*--- On donne une taille minimale de 60px au tableau ---*/
}

.X {
background-image: url('http://i51.tinypic.com/nvwifl.png'); /*--- Image de la corbeille ---*/
background-repeat: no-repeat; /*--- On ne fait apparaître l'image qu'une seule fois ---*/
background-position: center left; /*--- On positionne notre corbeille au milieu à gauche ---*/
background-color: #f7f7f7; /*--- Couleur de fond ---*/
border: 1px solid #000000; /*--- Taille, type et couleur de la bordure ---*/
color: #000000; /*--- Couleur du texte ---*/
padding-left: 90px; /*--- On espace la bordure gauche du texte de 55px ---*/
min-height: 60px; /*--- On donne une taille minimale de 60px au tableau ---*/
font-size: 15px; /* Titres de 22 pixels */
text-align: center; /* Pour centrer le titre */

}

.mainmenu {background: #96b6bb;}

body {
background-repeat: no-repeat;
}

.forumline{
border: 3px solid;
color : #96b6bb;

}

.sharing-cl{
overflow:hidden;
margin:-20px 0 0 0;
padding:0;
list-style:none;
width:530px;
}
.sharing-cl a{
overflow:hidden;
width:75px;
height:20px;
float:left;
margin-right:5px;
text-indent:-200px;
background:url(http://sd-2.archive-host.com/membres/up/24071559914142709/tuto_partager/partager.png) no-repeat;
}
a.sh-su{background-position:-210px -40px;}
a.sh-feed{background-position:-70px -40px;}
a.sh-tweet{background-position:-140px -40px;}
a.sh-mail{background-position:0 -40px;}
a.sh-digg{background-position:-280px -40px;}
a.sh-face{
margin-right:0;
background-position:-350px -40px;
}
a.sh-mail:hover{background-position:0 1px;}
a.sh-feed:hover{background-position:-70px 1px;}
a.sh-tweet:hover{background-position:-140px 1px;}
a.sh-su:hover{background-position:-210px 1px;}
.sh-digg:hover{background-position:-280px 1px;}
a.sh-face:hover{
background-position:-350px 1px;
}
#text{
margin-top:5px;
font-weight:bold;
font-family:helvetica,arial,sans-serif;
}
#text a{
text-indent:0;
height:auto;
text-align:center;
font-size:11px;
padding-top:35px;
color:#999;
text-decoration:none;
}

Merci!

Hop'

Puis-je avoir le lien de ton forum? s'il te plaît! Siffle

Sujet: Re: Barre de navigation Mar 01 Mar 2011, 17:43

ok voila: http://stereoskyline.nouslesfans.com/

Sujet: Re: Barre de navigation Mar 01 Mar 2011, 17:54

Hop'

Essaye de mettre ceci dans ton CSS si il n'est pas déjà mis:

Code:: .navi{
width: V% /*Mets le même pourcentage de la largeur de ton forum*/
}

Sujet: Re: Barre de navigation Mar 01 Mar 2011, 17:56

Code:: <center><td width="758px"align="{MENU_POSITION}"{MENU_NOWRAP}><span class="navi">{GENERATED_NAV_BAR}</span></td></center>

Sujet: Re: Barre de navigation Mar 01 Mar 2011, 18:01

Vos deux solution change absolument rien?

Sujet: Re: Barre de navigation Mar 01 Mar 2011, 18:44

Beh essaye Wink

Sujet: Re: Barre de navigation Mar 01 Mar 2011, 19:08

J'ai essayer mais ca changer rien. la preuve j'ai pas enlever le code et c'est pareil.

Sujet: Re: Barre de navigation Mar 01 Mar 2011, 19:14

modifie le 758px par la valeur de la largeur de ton forum en pourcentage et enleve la class que je t'ai donner

Sujet: Re: Barre de navigation Mar 01 Mar 2011, 19:27

Ca marche pas. C'est moi qui a rajouter ce bout de code

Code:: width="758px"

& je suis même pas si il est à la bonne place!

Sujet: Re: Barre de navigation Mer 02 Mar 2011, 09:35

A moins de rajouter plusieurs liens dans ta barre de navig' , je pense pas que tu pourras l'agrandir Wink

Mais tu peut rajouter une div en fond qui prennent la même largeur que ta ban' et qui soit de la même couleur de fond que les liens de ta barre Bravo !