J'étais très mal, avec un problème qui - tenez-vous bien - ne
survenait qu'avec FF 0.93 (Linux et Win), Konqueror 3.3.0 (Debian), Opera
7.50 (Linux), Opera 7.60 PR 1 (Win). Dans l'exemple ci-dessous le lien
dans l'encadré de droite n'est pas cliquable sauf sous IE 6.0 SP1, c'est
un comble !
Code xhtml strict valide et tout ça. Voici ce code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang='fr' xml:lang='fr'>
<head>
<meta http-equiv='content-type' content='text/html; charset=iso-8859-15' />
<title>Test float right</title>
<!-- un peu de visuel et des floats -->
<style type='text/css' media='screen'>
/*
Propriétés par défaut
*/
/* destiné à faire un encadré */
.note
{
margin: 4px ;
padding: 4px ;
background-color: yellow ;
}
</style>
</head>
<body id='site-id'>
<h1>Le document</h1>
<div class='block holly'> <!-- premier bloc du document -->
<h2>Float à droite</h2>
<p class='note right' style='width: 30%;'>
N'hésitez pas à utiliser le <a class='out' href="http://validator.w3c.org/">validateur du W3C</a>, cela économise des heures de debug !
</p>
<dl class='faq'>
<dt id='faq-1'>Première entrée</dt>
<dd>
C'est la première entrée de la faq.
</dd>
<dt id='faq-2'>Deuxième entrée</dt>
<dd>
C'est la deuxième entrée de la faq.
</dd>
</dl>
</div> <!-- doc -->
</body>
</html>
Pour que le lien situé dans le float right devienne cliquable il faut
supprimer le position: relative de la deuxième série de déclarations
CSS.
Les navigateurs standards ont visiblement tous le même comportement mais
j'avoue que cela m'intrigue.
De plus
ol, ul, dl
{
position: relative ;
}
sert à éviter un bug IE
(http://www.positioniseverything.net/explorer/ie-listbug.html) donc le fin
mot de l'histoire m'intéresse grandement.
Si quelqu'un en sait un peu plus sur ce sujet car des recherches google
comme : "link float right clickable" m'ont rien donné et j'avoue que
c'est la première fois que je tombe dessus.
Cette action est irreversible, confirmez la suppression du commentaire ?
Signaler le commentaire
Veuillez sélectionner un problème
Nudité
Violence
Harcèlement
Fraude
Vente illégale
Discours haineux
Terrorisme
Autre
Raphaël Wils
François Battail wrote:
Bonjour,
J'étais très mal, avec un problème qui - tenez-vous bien - ne survenait qu'avec FF 0.93 (Linux et Win), Konqueror 3.3.0 (Debian), Opera 7.50 (Linux), Opera 7.60 PR 1 (Win). Dans l'exemple ci-dessous le lien dans l'encadré de droite n'est pas cliquable sauf sous IE 6.0 SP1, c'est un comble !
Code xhtml strict valide et tout ça. Voici ce code :
À priori je dirais que c'est un probleme de blocs qui se recouvrent. Et bien que transparentes, les couches superieures peuvent ne pas donner accès à celles du dessous. Ca devrait être résolu en jouant sur les z-index, avec la propriété position qui va bien. cela dit on verrait mieux avec un lien. -- Raphaël http://www.r-wils.com/perso « Don't mean a thing if you ain't got that swing ! »
François Battail wrote:
Bonjour,
J'étais très mal, avec un problème qui - tenez-vous bien - ne
survenait qu'avec FF 0.93 (Linux et Win), Konqueror 3.3.0 (Debian), Opera
7.50 (Linux), Opera 7.60 PR 1 (Win). Dans l'exemple ci-dessous le lien
dans l'encadré de droite n'est pas cliquable sauf sous IE 6.0 SP1, c'est
un comble !
Code xhtml strict valide et tout ça. Voici ce code :
À priori je dirais que c'est un probleme de blocs qui se recouvrent. Et
bien que transparentes, les couches superieures peuvent ne pas donner
accès à celles du dessous.
Ca devrait être résolu en jouant sur les z-index, avec la propriété
position qui va bien.
cela dit on verrait mieux avec un lien.
--
Raphaël
http://www.r-wils.com/perso
« Don't mean a thing if you ain't got that swing ! »
J'étais très mal, avec un problème qui - tenez-vous bien - ne survenait qu'avec FF 0.93 (Linux et Win), Konqueror 3.3.0 (Debian), Opera 7.50 (Linux), Opera 7.60 PR 1 (Win). Dans l'exemple ci-dessous le lien dans l'encadré de droite n'est pas cliquable sauf sous IE 6.0 SP1, c'est un comble !
Code xhtml strict valide et tout ça. Voici ce code :
À priori je dirais que c'est un probleme de blocs qui se recouvrent. Et bien que transparentes, les couches superieures peuvent ne pas donner accès à celles du dessous. Ca devrait être résolu en jouant sur les z-index, avec la propriété position qui va bien. cela dit on verrait mieux avec un lien. -- Raphaël http://www.r-wils.com/perso « Don't mean a thing if you ain't got that swing ! »
François Battail
Le Fri, 10 Sep 2004 17:01:18 +0200, Raphaël Wils a écrit :
François Battail wrote:
<snip />
Dans l'exemple ci-dessous le lien dans l'encadré de droite n'est pas cliquable sauf sous IE 6.0 SP1, c'est un comble !
Code xhtml strict valide et tout ça. Voici ce code :
<snip />
À priori je dirais que c'est un probleme de blocs qui se recouvrent. Et bien que transparentes, les couches superieures peuvent ne pas donner accès à celles du dessous. Ca devrait être résolu en jouant sur les z-index, avec la propriété position qui va bien.
J'ai joué avec le z-index sur le ul, ol, dl et sur le p qui est en float right sans résultats :(, j'avais aussi limité à 50% la taille du ul et du dl sans résultat probant.
cela dit on verrait mieux avec un lien.
Désolé, je n'ai pas de serveur http ouvert sous la main c'est pourquoi j'ai attaché du code monolithique.
@+ fb
Le Fri, 10 Sep 2004 17:01:18 +0200, Raphaël Wils a écrit :
François Battail wrote:
<snip />
Dans l'exemple ci-dessous le lien dans l'encadré de droite n'est pas
cliquable sauf sous IE 6.0 SP1, c'est un comble !
Code xhtml strict valide et tout ça. Voici ce code :
<snip />
À priori je dirais que c'est un probleme de blocs qui se recouvrent. Et
bien que transparentes, les couches superieures peuvent ne pas donner
accès à celles du dessous.
Ca devrait être résolu en jouant sur les z-index, avec la propriété
position qui va bien.
J'ai joué avec le z-index sur le ul, ol, dl et sur le p qui est en
float right sans résultats :(, j'avais aussi limité à 50% la taille du
ul et du dl sans résultat probant.
cela dit on verrait mieux avec un lien.
Désolé, je n'ai pas de serveur http ouvert sous la main c'est pourquoi
j'ai attaché du code monolithique.
Le Fri, 10 Sep 2004 17:01:18 +0200, Raphaël Wils a écrit :
François Battail wrote:
<snip />
Dans l'exemple ci-dessous le lien dans l'encadré de droite n'est pas cliquable sauf sous IE 6.0 SP1, c'est un comble !
Code xhtml strict valide et tout ça. Voici ce code :
<snip />
À priori je dirais que c'est un probleme de blocs qui se recouvrent. Et bien que transparentes, les couches superieures peuvent ne pas donner accès à celles du dessous. Ca devrait être résolu en jouant sur les z-index, avec la propriété position qui va bien.
J'ai joué avec le z-index sur le ul, ol, dl et sur le p qui est en float right sans résultats :(, j'avais aussi limité à 50% la taille du ul et du dl sans résultat probant.
cela dit on verrait mieux avec un lien.
Désolé, je n'ai pas de serveur http ouvert sous la main c'est pourquoi j'ai attaché du code monolithique.
@+ fb
Raphaël Wils
François Battail wrote:
Le Fri, 10 Sep 2004 17:01:18 +0200, Raphaël Wils a écrit :
François Battail wrote:
<snip />
Dans l'exemple ci-dessous le lien dans l'encadré de droite n'est pas cliquable sauf sous IE 6.0 SP1, c'est un comble !
Code xhtml strict valide et tout ça. Voici ce code :
<snip />
À priori je dirais que c'est un probleme de blocs qui se recouvrent. Et bien que transparentes, les couches superieures peuvent ne pas donner accès à celles du dessous. Ca devrait être résolu en jouant sur les z-index, avec la propriété position qui va bien.
J'ai joué avec le z-index sur le ul, ol, dl et sur le p qui est en float right sans résultats :(, j'avais aussi limité à 50% la taille du ul et du dl sans résultat probant.
cela dit on verrait mieux avec un lien.
Désolé, je n'ai pas de serveur http ouvert sous la main c'est pourquoi j'ai attaché du code monolithique.
@+ fb
Et en mettant en plus un z-index de valeur inférieur sur les autres éléments ?
Attention le z-index ne s'applique que si l'élément est positionné (absolute, ou relative)
-- Raphaël http://www.r-wils.com/perso « Don't mean a thing if you ain't got that swing ! »
François Battail wrote:
Le Fri, 10 Sep 2004 17:01:18 +0200, Raphaël Wils a écrit :
François Battail wrote:
<snip />
Dans l'exemple ci-dessous le lien dans l'encadré de droite n'est pas
cliquable sauf sous IE 6.0 SP1, c'est un comble !
Code xhtml strict valide et tout ça. Voici ce code :
<snip />
À priori je dirais que c'est un probleme de blocs qui se recouvrent. Et
bien que transparentes, les couches superieures peuvent ne pas donner
accès à celles du dessous.
Ca devrait être résolu en jouant sur les z-index, avec la propriété
position qui va bien.
J'ai joué avec le z-index sur le ul, ol, dl et sur le p qui est en
float right sans résultats :(, j'avais aussi limité à 50% la taille du
ul et du dl sans résultat probant.
cela dit on verrait mieux avec un lien.
Désolé, je n'ai pas de serveur http ouvert sous la main c'est pourquoi
j'ai attaché du code monolithique.
@+
fb
Et en mettant en plus un z-index de valeur inférieur sur les autres
éléments ?
Attention le z-index ne s'applique que si l'élément est positionné
(absolute, ou relative)
--
Raphaël
http://www.r-wils.com/perso
« Don't mean a thing if you ain't got that swing ! »
Le Fri, 10 Sep 2004 17:01:18 +0200, Raphaël Wils a écrit :
François Battail wrote:
<snip />
Dans l'exemple ci-dessous le lien dans l'encadré de droite n'est pas cliquable sauf sous IE 6.0 SP1, c'est un comble !
Code xhtml strict valide et tout ça. Voici ce code :
<snip />
À priori je dirais que c'est un probleme de blocs qui se recouvrent. Et bien que transparentes, les couches superieures peuvent ne pas donner accès à celles du dessous. Ca devrait être résolu en jouant sur les z-index, avec la propriété position qui va bien.
J'ai joué avec le z-index sur le ul, ol, dl et sur le p qui est en float right sans résultats :(, j'avais aussi limité à 50% la taille du ul et du dl sans résultat probant.
cela dit on verrait mieux avec un lien.
Désolé, je n'ai pas de serveur http ouvert sous la main c'est pourquoi j'ai attaché du code monolithique.
@+ fb
Et en mettant en plus un z-index de valeur inférieur sur les autres éléments ?
Attention le z-index ne s'applique que si l'élément est positionné (absolute, ou relative)
-- Raphaël http://www.r-wils.com/perso « Don't mean a thing if you ain't got that swing ! »
François Battail
Le Fri, 10 Sep 2004 17:21:51 +0200, Raphaël Wils a écrit :
François Battail wrote:
<snip bug/effet de bord partout sauf IE avec des float right et des éléments en position: relative />
J'ai joué avec le z-index sur le ul, ol, dl et sur le p qui est en float right sans résultats :(, j'avais aussi limité à 50% la taille du ul et du dl sans résultat probant.
Et en mettant en plus un z-index de valeur inférieur sur les autres éléments ?
Pour faire simple un truc comme
html { z-index: -1 ; }
Attention le z-index ne s'applique que si l'élément est positionné (absolute, ou relative)
Ooppss, très juste donc il faut jouer sur les autres éléments que le float mais avec le css ci-dessus le problème se manifeste toujours.
@+ fb
Le Fri, 10 Sep 2004 17:21:51 +0200, Raphaël Wils a écrit :
François Battail wrote:
<snip bug/effet de bord partout sauf IE avec des float right et des
éléments en position: relative />
J'ai joué avec le z-index sur le ul, ol, dl et sur le p qui est en
float right sans résultats :(, j'avais aussi limité à 50% la taille
du ul et du dl sans résultat probant.
Et en mettant en plus un z-index de valeur inférieur sur les autres
éléments ?
Pour faire simple un truc comme
html
{
z-index: -1 ;
}
Attention le z-index ne s'applique que si l'élément est positionné
(absolute, ou relative)
Ooppss, très juste donc il faut jouer sur les autres éléments que le
float mais avec le css ci-dessus le problème se manifeste toujours.
Le Fri, 10 Sep 2004 17:21:51 +0200, Raphaël Wils a écrit :
François Battail wrote:
<snip bug/effet de bord partout sauf IE avec des float right et des éléments en position: relative />
J'ai joué avec le z-index sur le ul, ol, dl et sur le p qui est en float right sans résultats :(, j'avais aussi limité à 50% la taille du ul et du dl sans résultat probant.
Et en mettant en plus un z-index de valeur inférieur sur les autres éléments ?
Pour faire simple un truc comme
html { z-index: -1 ; }
Attention le z-index ne s'applique que si l'élément est positionné (absolute, ou relative)
Ooppss, très juste donc il faut jouer sur les autres éléments que le float mais avec le css ci-dessus le problème se manifeste toujours.
