Forum d'entraide PHPFrance

Bonjour,

Me faisant un petit site perso décrivant mon CV, j'ai mon menu placé après ma bannière dans le header et j'aimerai qu'il se place en haut automatiquement lorsqu'on commence à scroller. J'ai parfaitement réussi à le faire, mais par contre, il se place sur la gauche, plutot que de prendre toute la largeur de la page et je ne sais pas trop comment modifier le CSS du coup.
Mon menu est créé à partir de Zend_Navigation() sur lequel j'applique du CSS de Twitter Bootstrap.

le code HTML:

<nav role="navigation" class="navbar navbar-default" style="margin-bottom : 0;">
	<div class="container">
		<div id="navbarCollapse" class="collapse navbar-collapse">
			<?php
				echo $this->navigation($this->tabNavigationHeader)->menu();
			?>
		</div>	
	</div>		
</nav>

le code JS :
[javascript]
$(document).ready(function(){
var positionElementInPage = $('.navbar').offset().top;
$(window).scroll(
function() {
if ($(window).scrollTop() >= positionElementInPage) {
// fixed
$('.navbar').addClass("floatable");
} else {
// relative
$('.navbar').removeClass("floatable");
}
}
);
});
[/javascript]

et le code CSS qui doit prendre le pas lors du scroll :

.navbar.floatable {
    position: fixed;
    top : 0;
    margin : auto;
    z-index : 10000;
}

Concernant le code de la navbar, malheureusement je n'ai que le fichier bootstrap.min.css :/ mais l'url est à cette page : http://cv.fonfonland.fr/emplois

Merci d'avance

Problème solutionné par un de mes amis...suffit d'ajouter "width : 100%;"...voila désolé pour le dérangement

width: 100%; dans le .navbar.floatable

width: 100%; dans le .navbar.floatable

^^