28172 sujets

CSS et mise en forme, CSS3

Bonjour !
Voila avant tout chose, que cela soit clair, je ne connais rien au html et css.
C'est pas que je ne veut pas faire d'effort, mais je ne fait pas un site web, j'essaie de le modifié.
J'apprends donc suivent mes besoin. Soyer pas trop sévère....
(je pète déjà les plomb a chercher ou et quoi)

Voila mon problème, au niveau de la bannière du site je veut superposer des images, a la longue j'ai fini par tomber sur la fonction z-index, permettent de faire des couche.
Mais apparemment il faut l'associer a, position: absolute.
Or quand je fait cela, mes images sont bien superposées mais décalées.
Elle se repositionne si j'ai bien compris, avec d'autre valeur qu'avant.
Par rapport a son plus proche parent qui disent dans les post Smiley ohwell , et qu'il faut le mettre en position:relative.
Mais je ni arrive pas, j'ai regardé les posts ici ou il font se genre de chose en créant des div :

<td > 
    <div style="position:relative;width:100%"> 
        <div style="position:absolute"></div> 
    </div> 
</td>


ou

<div  id="relative-contenaire"> 
<table> le tableau </table> 
<img class="absolute_badge" src="tonbadge.jpg" alt="le texte du badge"/> 
</div>


je sais qu'il y a une partie de css a mettre....

Mais quand j'essaie la position des mes images est strictement identique quoi que je fasse !!!?
J'ai regardé pas mal de post mais je m'en sort pas.
Voila a quoi ressemble le code:

</head>
<body bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">

<a name="top"></a>

<table width="80%" cellspacing="0" cellpadding="10" border="0" align="center">
    <tr>
        <td class="bodyline"><table width="100%" cellspacing="0" cellpadding="0" border="0" >
            <tr>
              <td align="center" width="100%" valign="middle"><a href="portal.php"><img id="img2" src="image"  border="0" alt="{L_INDEX}" vspace="1" /><img id="img1" src="image" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
                </tr><tr>
                <td align="center" width="100%" valign="middle"><span class="maintitle">{SITENAME}</span><br /><span class="gen">{SITE_DESCRIPTION}<br />&nbsp; </span>
                <table cellspacing="0" cellpadding="2" border="0">
                    <tr>
                        <td align="center" valign="top" nowrap="nowrap"><span class="mainmenu">



et dans la partie CSS j'ai mis ca:

#img1 { z-index: 1; position: absolute; }
#img2 { z-index: 2; position: absolute; }

J'ai mis des # car je comprend pas la différence avec les .
(je verrai plus tard)


Si quelqu'un voulait bien m'aider ca serrai vraiment sympa, je tourne en rond
SVP Merci !
Modifié par Totem76 (09 Oct 2010 - 11:25)