Template joomle - superposition div
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:
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"> </td>
<td class="pill_m">
<div id="pillmenu">
<jdoc:include type="modules" name="user3" />
</div>
</td>
<td class="pill_r"> </td>
</tr>
</table>
</div>
</div>
</div>
</div> |
Et le CSS
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
| 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.