Le CSS et les tableaux

[Aye-Aye]

Pour l'instant, je n'ai guère le temps d'étudier cela... désolé.

[Pikooz]

Voici donc maintenant mon index :

Code: Tout sélectionner

   <div class="fenetre">
         <div class="fenetre_haut">
            <div class="fenetre_titre">.: Syst&egrave;me   d'exploitation (OS):.</div>
                 <div class="fenetre_sous_titre">Windows,logiciel, s&eacute;curit&eacute;, linux....</div>
         </div>
            
         <div class="fenetre_milieu">
             <p>Bonjour mesdames et messieurs</p>
         </div>
         
             <div class="fenetre_bas"></div>
   </div>

Et le CSS

Code: Tout sélectionner

/* #################### AFFICHAGE DES BOITES #################### */
   .fenetre
   {   width: 780px;
      height: 50px;}
   
   .fenetre_haut
   {    width: 780px;
      height: 28px;
      position:absolute;
      background-image: url("../images/haut.png");
      background-repeat: no-repeat;}

   .fenetre_milieu   
   {    padding-left : 15px;
      padding-right : 15px;
      padding-top : 10px;
      width: 750px;
      background-image: url("../images/milieu.png");}

   .fenetre_bas
   {    width: 780px;
      height: 22px;
      background-image: url("../images/bas.png");
      background-repeat: no-repeat;}

   .fenetre_titre
   {   width: 290px;
      height: 13px;
      float:left;
      font-style: italic;
      font-weight: bold;
      color:133e73;
      margin-left:15px;
      font-size: 13px;
      margin-top:10;}

   .fenetre_sous_titre
   {   width:450px;
      height:13px;
      overflow: auto;
      margin-top:10px;
      color:maroon;
      font-style: italic;
      font-weight: bold;
      font-size: 13px;
      margin-left:15px;}
      
/* #################### FIN AFFICHAGE DES BOITES #################### */

Le rendu est le suivant (just pour la boite du milieu je précise) :

- http://photoshop-creation.info/aaa/

Quelqu'un peut m'aider ?

[Zim']

Alors voici la fenetre que je veux traduire en div et css :



J'ai tracé vulgairement les découpes des images.

A ta place je ferais trois découpes:


le haut de la boite dans laquel tu mettra un padding left pour le texte...

le bas de la boite

le milieu de la boite, d'un pixel de hauteur, ou tu appliquera un repeat sur la hauteur

ce serais beaucoup plus simple et beaucoup plus light quand meme :p

[Pikooz]

C'est ce que j'ai fait par la suite justement

Lis mon dernier post, mainteannt j'ai bien le haut, le milieu et le bas, et dans le haut je veux 2 case pour saisir mon titre et un sous titre sur la meme ligne (de style différent)

Donc peux tu relire mon dernier post stp et me dire ce que tu en pense merci

[remy498]

A mon avis, reprend ton design de 0 (au niveau programmation) car là tu essaies de modifier tout en laissant des choses comme ça :

Code: Tout sélectionner

</div>
</body>
</html>

L'intérêt étant que ton design soit entièrement en css et qu'il n'y ait plus aucun tableau (notamment au niveau des menus).

Aussi attention au rendu qui n'est pas le même si tu utilises Mozilla et IE.

[Pikooz]

Ca c'est parce que tu as regardé la source du site, et pas celle que j'ai citée

Parce que le site charge mon header, qui lui est très "sale" niveau code.

Pour le source de l'index je veux partir comme ceci (juste pour une fenetre)

Code: Tout sélectionner

   <div class="fenetre">
         <div class="fenetre_haut">
            <div class="fenetre_titre">.: Syst&egrave;me   d'exploitation (OS):.</div>
                 <div class="fenetre_sous_titre">Windows,logiciel, s&eacute;curit&eacute;, linux....</div>
         </div>
           
         <div class="fenetre_milieu">
             <p>Bonjour mesdames et messieurs</p>
         </div>
         
             <div class="fenetre_bas"></div>
   </div>