design liquide

29 août 2006, 15:51

Bonjour
je met en place un design liquide, donc je me sers excusivement du positionnement float;
mais mon menu sous FF est coupé à droite alors chose nouvelle IE l'affiche correctement.
http://creatif-web.be/developpeur/index.php

Code : Tout sélectionner

/********************************** head  ************************************/

#head1 {
background: transparent url(../img/art_04.png) top left repeat-x;
padding:0 0 0 0;
margin:10px 0 0 10px;
height:127px;
}
#head1 h1 {
	padding:0px;
	margin: 0px;
	float: left;
	width: 498px;
	height: 171px;
	background: transparent url(../img/art_03.png) top right no-repeat;
}
#head1 h2{
	height: 171px;
	width:120px;
	float: right;
	top: 0px;
	margin: 0px;
	padding: 0px;
	background: transparent url(../img/art_06.png) top left no-repeat;
	z-index:2;
}
#head  h1 span {
display:none;
}
#head  h2 span {
display:none;
}
/*---------------------- premier menu----------------------*/
#menu_profondeur {
float:right;
margin-right:50px;
margin-top:-85px;
z-index:1;
}
#menu_profondeur ul {
margin:0;
padding:0;
list-style-type:none; 
}
#menu_profondeur li {
float:right;
}
#menu_profondeur a {
display:block;
width:120px;
border:1px;
color:#fff ;
background:#FF9900;
margin:0 1px;
text-decoration:none;
text-align:center;
}
#menu_profondeur li a:hover {
color:#003366;
background:#FF6633;
border-width: 2px 1px 1px 2px;
border-color: #4a4a4a #cecece #cecece #4a4a4a ; 
}

Merci

29 août 2006, 16:02

Ça vient de ce que tu as une image qui passe par dessus le lien. Tu peux peut-être régler ça avec un z-index.

29 août 2006, 16:18

j'avais essayer le z-index.

Code : Tout sélectionner

<div id="head1">
		<h1>
			<span>
                        </span>
		</h1>
		<h2>
			<span>
			</span>
		</h2>
	<div id="menu_profondeur">
		<ul>
			<li><a href="http://creatif-web.be/developpeur/admin/admin_index.php">Administration</a></li>
			<li><a href="../../commande.php">Commande</a></li>
			<li><a href="../../a_propos.php"><span>A propos</span></a></li>
		</ul>
	</div>
</div>

en mettant le menu dans la head sa fonctionne maintenant sous FF mais pas sous IE, je m'arrache les cheveux un à un, lol.
en faite se sont les deux images a droite et à gauche qui sont en float et que je n'arrive pas mettre en dessous du menu, la troisième img se répète en x sur la largeur .

29 août 2006, 17:05

j'ai réglé le problème en mettant en position absolute;
Je mettrai une règle pour FF avec cette syntaxe #head1>div" si quelqu'un à d'autre idée pour se genre de problème ?
En utilisant les cascades à fond on arrvie a quelque chode de probant.

29 août 2006, 17:08

#head1>div {
margin-right:50px;
}

design liquide

Qui est en ligne