Logo GNT
Actualités Tests & Guides Bons Plans
GTA 6 iPhone 17 Copilot Switch 2 Temu ChatGPT Tesla
OVH Cloud OVH Cloud
Entraide Développement Développement Langage PHP et ce qu'il y a dedans

et ce qu'il y a dedans

18 réponses
Avatar
Sergio
Question :
Bon, "ça marche chez moi" (FF 3.5 et Chrome), mais est-ce légal dans un lien de mettre entre le <a> et le </a> tout une <div> avec
des div inbriqués dedans ? :

<a href="toto.html"><div>toute une construction...</div></a>

Ma page à question :
http://touchalon.free.fr

--
Serge http://leserged.online.fr/
Mon blog: http://cahierdesergio.free.fr/
Soutenez le libre: http://www.framasoft.org
Signaler un problème avec ce contenu

8 réponses

Supprimer
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
1 2
Avatar
Sergio
docanski a écrit :

Par contre, ceci est possible :

<?xml version="1.0" encoding="iso-8859-1"?>
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>lien occupant 100 % d'une page</title>
</head>
<body>
<div id="centre"><h1>ton titre</h1>
<a href="#"
style="width:100%;height:100%;position:absolute;top:0;left:0">&nbsp;</a>
Tu écris ce que tu veux et tu mets ce que tu veux dans le conteneur ...
s'il y en a un.
</div>
</body></html>



Rajouter un z-index:2 pour le lien et un z-index:1 pour la div globale.
Néanmoins, avec Opera, le z-index n'a pas l'air de se propager dans les "sous-div". (ça marche avec FF et Chrome).

--
Serge http://leserged.online.fr/
Mon blog: http://cahierdesergio.free.fr/
Soutenez le libre: http://www.framasoft.org
Avatar
Sergio
Sergio a écrit :

Rajouter un z-index:2 pour le lien et un z-index:1 pour la div globale.
Néanmoins, avec Opera, le z-index n'a pas l'air de se propager dans les
"sous-div". (ça marche avec FF et Chrome).



Par contre, je m'aperçois que IE (7 et 8) se vautre complètement dans la présentation... grrrr... Le coup de l'image n'est pas si
bête que ça...

--
Serge http://leserged.online.fr/
Mon blog: http://cahierdesergio.free.fr/
Soutenez le libre: http://www.framasoft.org
Avatar
SAM
Le 12/20/09 9:57 AM, Sergio a écrit :
docanski a écrit :

Par contre, ceci est possible :

<?xml version="1.0" encoding="iso-8859-1"?>
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=ISO-8859-1" />
<title>lien occupant 100 % d'une page</title>
</head>
<body>
<div id="centre"><h1>ton titre</h1>
<a href="#"
style="width:100%;height:100%;position:absolute;top:0;left:0">&nbsp;</a>
Tu écris ce que tu veux et tu mets ce que tu veux dans le conteneur
... s'il y en a un.
</div>
</body></html>



Rajouter un z-index:2 pour le lien et un z-index:1 pour la div globale.



Les z-index c'est du blabla
(les navigateurs en font un peu ce qu'ils veulent)

Néanmoins, avec Opera, le z-index n'a pas l'air de se propager dans les
"sous-div". (ça marche avec FF et Chrome).



Le truc est de mettre le A juste avant la fermeture du body
(il a ainsi naturellement le z-index le + élevé)


--
sm
Avatar
docanski
Alors que les eleveurs et agriculteurs polluent toujours la Bretagne,
Sergio ecrit ce qui suit en ce 20/12/2009 09:57 :

Rajouter un z-index:2 pour le lien et un z-index:1 pour la div globale.
Néanmoins, avec Opera, le z-index n'a pas l'air de se propager dans les
"sous-div". (ça marche avec FF et Chrome).



En utilisant un position:fixed au lieu de position:absolute, il n'y a
plus de problème de hauteur de page.
C'est toujours ça de pris.
L'indexation des éléments est inutile : elle ne fonctionne ni avec Opera
ni avec IE (je n'ai que le 6 pour essayer)
Par contre, ça roule sans problème avec la famille Mozilla.
Reste à trouver des béquilles (une fois de plus pour le premier !) pour
MSIE et Opera qui, chose rare, se vautre aussi lamentablement que le
machin édité à Redmond.

Cordialement,
--
docanski

Portail et annuaire du nord-Bretagne : http://armorance.free.fr/
Guide des champignons d'Europe : http://mycorance.free.fr/
La vallée de la Rance maritime : http://valderance.free.fr/
Les côtes du nord de la Bretagne : http://docarmor.free.fr/
Avatar
SAM
Le 12/20/09 12:32 PM, docanski a écrit :
Alors que les eleveurs et agriculteurs polluent toujours la Bretagne,
Sergio ecrit ce qui suit en ce 20/12/2009 09:57 :

Rajouter un z-index:2 pour le lien et un z-index:1 pour la div globale.
Néanmoins, avec Opera, le z-index n'a pas l'air de se propager dans
les "sous-div". (ça marche avec FF et Chrome).



En utilisant un position:fixed au lieu de position:absolute, il n'y a
plus de problème de hauteur de page.



À mon idée, IE a besoin du layout (et il semblerait que Opera aussi)
<http://msdn.microsoft.com/en-us/library/ms533776(VS.85).aspx>

C'est donc mieux en fixant les dimensions
width: 100%; height: 100%;
ou peut-être en mettant : display: inline-block; ?
(pas essayé)

Il faut aussi ajouter le background pour Opera
background: url(inconnu.jpg) repeat top left;
l'image n'existe pas pour de vrai mais ça suffit à tromper Opera.9.6
Par contre si on met 'transparent' pour le fond ... ça continue à
merdouiller (le H1 n'est pas réactif)

Bon, et en plus, tout ça doit réagir différemment suivant le doctype ?
(testé avec html4.1.0 strict)

L'indexation des éléments est inutile : elle ne fonctionne ni avec Opera
ni avec IE (je n'ai que le 6 pour essayer)



il faut utiliser l'indexation de couche obtenue naturellement par le
flux html.
(le A doit être tout à la fin du fichier)

Par contre, ça roule sans problème avec la famille Mozilla.



Finalement, c'est ch..t ces navigateurs qui fonctionnent ;-)

--
sm
Avatar
rm
Salut,
Le dimanche 20 décembre 2009 à 12:32, docanski a écrit :

Alors que les eleveurs et agriculteurs polluent toujours la Bretagne,
Sergio ecrit ce qui suit en ce 20/12/2009 09:57 :

Rajouter un z-index:2 pour le lien et un z-index:1 pour la div globale.
Néanmoins, avec Opera, le z-index n'a pas l'air de se propager dans les
"sous-div". (ça marche avec FF et Chrome).





Est-ce que « ça marche avec FF et Chrome » signifie-t-il, ici, que FF et
Chrome respectent le Standard ?

En utilisant un position:fixed au lieu de position:absolute, il n'y a
plus de problème de hauteur de page.
C'est toujours ça de pris.
L'indexation des éléments est inutile : elle ne fonctionne ni avec Opera
ni avec IE (je n'ai que le 6 pour essayer)
Par contre, ça roule sans problème avec la famille Mozilla.



Opera documente son implémentation de z-index sur
http://dev.opera.com/articles/view/37-css-absolute-and-fixed-positioning/#zindex
mais ne dit pas implicitement faire « tout comme Gecko ou Webkit » :-D

Reste à trouver des béquilles (une fois de plus pour le premier !) pour
MSIE et Opera qui, chose rare, se vautre aussi lamentablement que le
machin édité à Redmond.



Je ne m'y connais pas trop mais en essayant de déchiffrer
http://www.w3.org/TR/CSS2/visuren.html#z-index je ne vois pas où Opera
violerait la spécification...
Vous autres spécialistes des Standards sauront sans doute m'éclairer ;)

@+
--
rm - http://opera-fr.com
Avatar
SAM
Le 12/21/09 11:50 AM, rm a écrit :
Salut,

Opera documente son implémentation de z-index sur
http://dev.opera.com/articles/view/37-css-absolute-and-fixed-positioning/#zindex
mais ne dit pas implicitement faire « tout comme Gecko ou Webkit » :-D



Moi ce que je retiens c'est :
« When two elements in the same stacking context have the same stack
level, the one that occurs later in the source code will appear on top
of its preceding siblings. »

Maintenant, avec :

<h1>blabla</h1>
<div style="height:300px">remplissage</div>
<p><a href="1.htm"
style="position:absolute;width:100%;height:100%;top:0">test</a></p>

vu dans Opera 9.6
les textes sont comme s'ils avaient un z-index bien supérieur à leur
conteneurs
(ils échappent au lien recouvrant)

Phénomène n'apparaissant pas avec Firefox.

Pour Opera il semble qu'il lui faille en plus un background
(un vrai faux fond lui suffisant) :

<h1>blabla</h1>
<div style="height:300px">remplissage</div>
<p><a href="1.htm"
style="position:absolute;width:100%;height:100%;top:0;background:url()">test</a></p>

--
sm
Avatar
Olivier Miakinen
Le 21/12/2009 13:24, SAM a écrit :

Moi ce que je retiens c'est :
« When two elements in the same stacking context have the same stack
level, the one that occurs later in the source code will appear on top
of its preceding siblings. »

Maintenant, avec :

<h1>blabla</h1>
<div style="height:300px">remplissage</div>
<p><a href="1.htm"
style="position:absolute;width:100%;height:100%;top:0">test</a></p>

vu dans Opera 9.6
les textes sont comme s'ils avaient un z-index bien supérieur à leur
conteneurs
(ils échappent au lien recouvrant)



Je dirais plutôt que la portée du <a> dans le cas d'un élément inline
est étendue différemment à sa boîte de bloc générée dans Opera et dans
Firefox, avec un background transparent...

Voir par exemple ici :

<h1>blabla</h1>
<div style="height:300px">remplissage</div>
<p><a href="1.htm"
style="position:absolute;width:100%;height:100%;top:0;">test<br>
test<br>
test<br>
test<br>
test<br>
test<br>
test<br>
test</a></p>

Le texte dans le lien recouvre bien tout texte placé avant, et il est
cliquable. Mais il se trouve que dans Opera un background transparent
laisse passer non seulement les pixels mais aussi l'état cliquable ou
non de ce qui est derrière. Cela dit, ce comportement est (au moins
partiellement) indépendant du z-index.

Phénomène n'apparaissant pas avec Firefox.

Pour Opera il semble qu'il lui faille en plus un background
(un vrai faux fond lui suffisant) :

<h1>blabla</h1>
<div style="height:300px">remplissage</div>
<p><a href="1.htm"
style="position:absolute;width:100%;height:100%;top:0;background:url()">test</a></p>



C'est effectivement troublant de voir un comportement différent avec
« background-color:transparent » d'avec un background ne s'étendant
pas sur la totalité de l'élément, mais bon, si c'est un bug, je ne crois
pas qu'on puisse l'imputer au z-index.
1 2