z-index et les éléments style input, liens ,etc

Version imprimable

11/02/2008, 14h46
mLk92

z-index et les éléments style input, liens ,etc

Salut à tous,

J'ai crée un espèce de tableur en HTML/CSS, où l'on peut donc circuler dans les lignes et colonnes du tableux tout en ayant des titre de colonne ou ligne fixés.

Pour faire ceci, j'ai utilisé 4 tableau que j'ai imbriquée et qui possède des z-index.

Mon gros problème est que dans la partie ayant un z-index bas (mes donnée), eh bien, je dispose d'input text, checkbox, liens, etc où j'aimerais accèder. Mais je n'ai pas cela à cause du z-index :fou: .

Cela fonctionne sous ie, mais pas firefox :sweat:

Est-ce que quelqu'un aurait une solution à ce problème ?

Merci d'avance pour vos réponses !
11/02/2008, 15h04
DavidDeTroyes

Aurais tu un bout de code à nous montrer ?

1 pièce(s) jointe(s)

Je peux vous montrer le code css, le html étant trop long :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
.topLineTitle{
	width: 390px;
	height: auto;
	position: absolute;
	left: 0px;
	top: 0px;
	margin: 0px;
	padding: 0px;
	border-collapse: collapse;
	z-index: 3;
}
 
.titleLine {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	margin: 0px;
	padding: 0px;
	overflow-y: scroll;
	overflow-x: hidden;
	z-index: 1;
}
 
.titreColonne{
	width: 98.5%;
	height: 100%;
	overflow-x: scroll;
	overflow-y: hidden;
	position: absolute;
	margin: 0px;
	padding: 0px;
	border-collapse: collapse;
	left: 0px;
	top: 0px;
	z-index: 2;
}
 
.donnees {
	width: 98.4%;
	height: 100%;
	overflow: hidden;
	position: absolute;
	left: 0px;
	top: 0px;
	margin: 0px;
	padding: 0px;
	z-index: 0;
}

Voici en gros la répartition des 4 div.

11/02/2008, 17h23
Erwan31

Bonjour,
a priori ça peut venir du positionnement absolue.
Pourquoi utilises tu ce type de positionnement? Est-ce obligatoire?

Juste une précision:
les propriété overflow x et y qui ne fonctionnent que sur IE et Firefox 1.5 > 3
sont invalidantes pour ta CSS pusiqu'elles sont absentes des spécifications CSS2.1.
Tu dois t'assurer que les navigateurs qui ne les interprètent pas auront un rendu satisfaisant en leur absence.

Le mieux serait d'avoir un exemple en ligne ;)
12/02/2008, 10h47
mLk92

Citation:

Envoyé par Erwan31

Bonjour,
a priori ça peut venir du positionnement absolue.
Pourquoi utilises tu ce type de positionnement? Est-ce obligatoire?

Juste une précision:
les propriété overflow x et y qui ne fonctionnent que sur IE et Firefox 1.5 > 3
sont invalidantes pour ta CSS pusiqu'elles sont absentes des spécifications CSS2.1.
Tu dois t'assurer que les navigateurs qui ne les interprètent pas auront un rendu satisfaisant en leur absence.

Le mieux serait d'avoir un exemple en ligne ;)

La position absolute me permet de positionner chacun de mes div afin qu'il se complémente et forme un seul et même tableau, le div de donnée devant être à l'intérieur des deux div (colonne et ligne) pour pouvoir faire agir le tableau comme un tableur excel. Le coulissement s'effectue via du javascript, d'où les scroll x et y.

Je sais malheureusement que ce n'est pas valide par W3C, mais ce n'est pas important, c'est une appli java qui tourne que sur IE > 6 et FF 2, et ca fonctionne sous ie, mais firefox me bloque toutes balises actives (input, liens, etc) à cause des z-index...

Est -ce qu'il y aurais pas une méthode en javascript ou autre ?

Je ne dois pas être le seul à avoir un problème de lien inactif à cause de superposition, si ? :(
18/03/2010, 15h46
cedsun

J'ai le même type de soucis.

As-tu trouvé une solution ?