28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,


voici le problème dont je n'arrive pas à résoudre:

Je place mes éléments de cette façon dans mon header:


css
------------------------------------------

#header {
	height: 227px;
	background-image: url(../img_jeux_flash/header_jeux_flash.jpg);
	background-repeat: no-repeat;
	background-position: top;
}
#header p.logo{
	position: absolute;
	margin: 0;
	padding: 32px 0 0 12px;
}
#header p.banner468{
	position: absolute;
	margin: 0;
	padding: 132px 0 0 228px;
}
#header p.txt{
	position: absolute;
	margin: 0;
	padding: 31px 0 0 400px;
	font-size: 14px;
	color: #FFFFFF;
}


code dans ma page
----------------------------------

<div id="header">
		<p class="logo"><a href="index.php"><img src="img_jeux_flash/logo_jeux_flash.gif" width="356" height="92" border="0" alt="Logo des jeux flash"/></a></p>
		<p class="banner468"><a href="#" ><img src="img_jeux_flash/banner_468x60.gif" width="468" height="60" border="0" alt="banner des jeux flash"/></a></p>
		<p class="txt"><strong>La nouvelle référence des jeux flash ...</strong></p>
</div>



Mon problème est que les liens ne sont pas accessibles avec firefox. Avec IE, ça passe sans problème. Souvent c'est plutôt le contraire. Smiley cligne

Quelqu'un pourrait-il résoudre mon problème.

Merci d'avance pour vos réponses.

Kevin
Modifié par kevvv (15 Mar 2008 - 20:05)
Salut, tu dois faire attention à l'ordre des calques avec le positionnement absolute, le div banner468 recouvre le div logo qui est alors inutilisable, un z-index:1 sur le logo le replace au dessus et résout le problème.
Une remarque, les propriétés top et left servent à placer précisément les éléments dans la page, je les utiliserais ici à la place du padding qui est plutôt une marge interne, c'est d'ailleurs cette marge qui recouvre le logo et empêche le clic sur le lien.

Un exemple pour résoudre le problème:
#header p.banner468 {
position:absolute;
top:140px;
left:236px;
}
Petit conseil : utilise la balise [ code ] pour tes exemples...
Ça peut être dangereux dans le coin Smiley sourire .
Salut Mumblefoot,

mon problème est résolu grâce à toi, en plus tu m'as fourni l'explication de mon problème.

C'est parfait ... Un grand merci à toi

Smiley biggrin