Template joomle - superposition div

Mage-Li · 28/11/2010, 20h05

Bonjour,
J'essaye depuis plus d'une semaine de superposer une div sous une autre pour intégrer un design sous Joomla.

J'ai fais beaucoup, beaucoup de test (z-index, clear, etc) et lue beaucoup de chose. Rien ne fonctionne. Je pose les armes (pour l'instant !) et viens vous demander conseil.

Ce que je veux obtenir c'est que la div tabarea se place sous le header tout en gardant son positionnement.

Voici ma structure :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<body id="page_bg" class="color_<?php echo $this->params->get('colorVariation'); ?> bg_<?php echo $this->params->get('backgroundVariation'); ?> width_<?php echo $this->params->get('widthStyle'); ?>">
<a name="up" id="up"></a>
<div class="center" align="center">
	<div id="wrapper">
	<div id="wrapper_r"
		<div id="wrapper_center">
				<div id="header">
					<div id="header_l">
						<div id="header_r">
							<div id="logo"></div>
							<jdoc:include type="modules" name="top" />
						</div>
					</div>
				</div>
 
				<div id="tabarea">
					<div id="tabarea_l">
						<div id="tabarea_r">
							<div id="tabmenu">
							<table cellpadding="0" cellspacing="0" class="pill">
								<tr>
									<td class="pill_l">&nbsp;</td>
									<td class="pill_m">
									<div id="pillmenu">
										<jdoc:include type="modules" name="user3" />
									</div>
									</td>
									<td class="pill_r">&nbsp;</td>
								</tr>
								</table>
							</div>
						</div>
				</div>
			</div>

Et le CSS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
div#header_l {
	position: relative;
}
 
div#header_r {
	height: 90px;
	padding-left: 370px;
	padding-right: 30px;
	padding-top: 25px;
	overflow: hidden;
	text-align: left;
}
 
div#logo {
	position: absolute;
	left: 0;
	top: 0;
	float: left;
	width: 298px;
	height: 75px;
	background: url(../images/mw_joomla_logo.png) 0 0 no-repeat;
	margin-left: 30px;
	margin-top: 25px;
}
 
div#newsflash {
	width: auto;
	margin-left: 350px;
	margin-right: 30px;
	border: 1px solid #00f;
}
 
div#tabarea {
	background: #f7f7f7 url(../images/mw_header_b.png) 0 0 repeat-x;
	margin: 0 11px;
 
}
 
div#tabarea_l {
	background: url(../images/mw_header_l_b.png) 0 0 no-repeat;
	padding-left: 32px;
}
 
div#tabarea_r {
	height: 42px;
	background: url(../images/mw_header_r_b.png) 100% 0 no-repeat;
	padding-right: 1px;
}

Je suis preneur de toute suggestion.

ornitho13 · 29/11/2010, 12h13

Salut,

je viens de tester et je constate que cela fonctionne, le problème doit peut être venir du code inséré par:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<jdoc:include type="modules" name="..." />

De plus ton code html n'est pas très bon, il manque a priori des balises fermantes (peut être un problème de copier/coller)

Mage-Li · 04/12/2010, 19h02

Merci ornitho13 pour ta réponse.
Malheureusement suite à une mauvaise sauvegarde j'ai détruis une partie de mon travail ce qui m'a quelque peut découragé.
J'ai réussi à revenir à ce que j'avais, mais pas de la même façon ! Mon code à changé.

Pour le code javascript je me doutais que c'est lui qui fout la merde avec les z-index.

Dés que j'aurais refais quelque teste je re-pose ma question.

29/11/2010, 12h13	#2
ornitho13 Rédacteur/Modérateur Jérome Debray Responsable de projet Inscription : mai 2009 Messages : 627 Détails du profil Informations personnelles : Nom : Jérome Debray Âge : 32 Localisation : France Informations professionnelles : Activité : Responsable de projet Secteur : High Tech - Multimédia et Internet Informations forums : Inscription : mai 2009 Messages : 627 Points : 3 064 Points : 3 064	Salut, je viens de tester et je constate que cela fonctionne, le problème doit peut être venir du code inséré par: Code html : Sélectionner tout - Visualiser dans une fenêtre à part <jdoc:include type="modules" name="..." /> De plus ton code html n'est pas très bon, il manque a priori des balises fermantes (peut être un problème de copier/coller)
	00

04/12/2010, 19h02	#3
Mage-Li Invité de passage Inscription : mars 2006 Messages : 6 Détails du profil Informations forums : Inscription : mars 2006 Messages : 6 Points : 1 Points : 1	Merci ornitho13 pour ta réponse. Malheureusement suite à une mauvaise sauvegarde j'ai détruis une partie de mon travail ce qui m'a quelque peut découragé. J'ai réussi à revenir à ce que j'avais, mais pas de la même façon ! Mon code à changé. Pour le code javascript je me doutais que c'est lui qui fout la merde avec les z-index. Dés que j'aurais refais quelque teste je re-pose ma question.
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email