28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous, voici mon problème.

J'ai un menu horizontal dont je ne peux définir de largeur (contenu dynamique multilingue).

Ce menu comporte 10 boutons et risque fort de dépacer les 760 px.

J'aimerais que la page défile en largeur pour les utilisateurs en 800*600, et que les 10 boutons restent sur la même ligne.

Par ailleurs, le reste du contenu doit remplir la page dans un cadre, avec une marge de 2% des bords du navigateur.

ma question est : comment éviter que les éléments de menu (li) passent à la ligne si la fenêtre est trop petite, et comment obliger la bannière à remplir l'intégralité de la largeur si il y a un défilement horizontal.

Voici mon CSS :

* {
	margin:0;
	padding:0;
}

html {
	height:100%;
}

body {
	margin:1%;
	height:97%;
	border:1px solid #827B87;
}

/*	BANNIERE	*/

#banniere {
	height:150px;
	margin:0 auto;
	background-image:url(../images/banniere.jpg);
	background-position:center;
}

/*	MENU	*/

#menu {
	height:28px;
	background-image:url(../images/fond-menu.png);
	background-repeat:repeat-x;
}

#menu ul {
	text-align:center;
}

#menu li {
	display:inline;
	line-height:28px;
	text-align:center;
	list-style-type:none;
	padding:0 5px;
	font-size:12px;
	border-left:1px solid white;
}

#dernier {
	border-right:1px solid white;
}


Merci de votre aide.