svp, ....aidez moi à éliminer les frames de mon site merci

svp, ....aidez moi à éliminer les frames de mon site merci - HTML/CSS - Programmation

Marsh Posté le 15-06-2006 à 07:51:31    

http://enfantskdos.fr/sidyj/sidyjonline.jpg
 
Bonjour à tous j'ai un probème qui me ronge car j'en n'ai assé des frames, alors j'ai opté pour les includes en php
mais voila je n'arrive pas reproduire  les positions exactes de mes calques qui sont sur le print screen.  
Mon site se partage en 4 frames, le 2 frames de gauche et de droite pour le fond, la frame d'en haut pour le logo, la banierre le menu et l'animation flash  noir et les icones. La frame d'en dessous est la pour les pages.  
La banniere, le logo, l'animation flash et le menu flash ainsi que les icons sont tous positionnés avec cette fonction
 

Code :
  1. <div id="Layer1" style="position:absolute; width:200px; height:115px; z-index:1; left: 139px; top: 0px"><img src="sidyjonline_homehead0.jpg" width="660" height="115"></div>


 
Ces calques qui fonctionnent tres bien lorque ils sont dans une frame sans CSS. tout ce complique quand la frame posse et des calques et des css, les css se posisionnent en dessous de mes calques car certains navigateurs ne dimensionnent pas de la même maniere les css.
 
Donc CSS et layers ca peut devenir la cata tres vite car si j'ai bien compris la valeur absolue d'un calque peut ne plus être en accord avec les valeurs des css si ceux ci ne sont pas dimensionnés de la même maniere sous tous les navigateurs.  
 
J'aimerais arreter d'avoir recour à  

Code :
  1. <frameset cols="*,800,*" frameborder="NO" border="0" framespacing="0">
  2.   <frame name="left" scrolling="NO" noresize src="left.htm" >
  3.   <frame name="middle" src="intro2.htm" scrolling="NO">
  4.   <frame name="right" scrolling="NO" noresize src="right.htm" >
  5. </frameset>


dans mon index n'avoir q'une seule et unique page en php qui determinerais la page central en largeur, les cotés, et tous positionné comme sur la photo sans avoir recourt ni aux layers ou aux frames mais aux includes et du positionnement CSS pur sans tableau car eux ne sont pas tres precis.
 
Hardware.fr c'est aussi une seul frame avec du positionnement dans une feuille CSS et du PHP mais pas une seule sous frame et tous les elements sont bien imbriqués les uns dans les autres sans le moindre prob.
 
Merci de votre aide, je ne vous demandes pas de faire mon travail mais plutot de me guider pour avancer dans ma demarche car je pédale dans le yaourt j'ai pas dormis de la nuit.  
 
merci  :hello:

Reply

Marsh Posté le 15-06-2006 à 07:51:31   

Reply

Marsh Posté le 15-06-2006 à 08:22:20    

Primo, tu as besoin d'un tableau. En tout premier, un tableau. Dans lequel tu va mettre toute ta page.
 
Ensuite, pour le CSS...
position: absolute: ça tu peut virer, ça positionne sur la page sans tenir compte de l'imbrication
width: ...px: les dimensions en pixels devraient être utilisées uniquement pour les images. Préfère toujours les %, les <<em>> et les <<ex>> dès qu'il s'agit de textes.
z-index: ça te sert à rien dans ce cas. en fait, il est très rare que ça servent, uniquement quand tu as besoin d'un effet spécial pour qu'un calque recouvre partiellement un autre.
 
Je te conseille vivement de lire la doc CSS1:
http://www.w3.org/TR/CSS1
... c'est pas très long, et ça répondra à la plupart de tes questions.

Reply

Marsh Posté le 15-06-2006 à 08:53:12    

nargy a écrit :

Primo, tu as besoin d'un tableau. En tout premier, un tableau.


 
moui ....
moyen bof
j hesite encore ..et puis
 
NON :o
 
vu la mise en page on peut tout faire tres facilement sans tableau :/
apres pour le reste ok
tfacon faut jamais laisser dreamweaver faire le code a ta place  :pfff:  
 
par exemple ca

Code :
  1. <div id="Layer1" style="position:absolute; width:200px; height:115px; z-index:1; left: 139px; top: 0px">
  2. <img src="sidyjonline_homehead0.jpg" width="660" height="115"></div>


 
tres mal
 
deja c est pas les memes widths j ai du rater un episode
et en mieux ca pourrait ressembler a ca pour le html
 

Code :
  1. <img src="sidyjonline_homehead0.jpg" id="sidyj_head" alt="le_nom_de_mon_site">


 
et en css
 

Code :
  1. #sidyj_head {
  2. width:660px;
  3. height:115px;
  4. float:left;
  5. margin: 0 0 0 139px;
  6. }


 
peut etre il faudra bidouiller un peu apres
mais rien de tel que de mettre les mains dans le cambouis
 
sinon la doc css existe en francais  
http://www.yoyodesign.org/doc/w3c/css2/cover.html

Reply

Marsh Posté le 15-06-2006 à 09:23:07    

Je vais regarder tout ca avec plus de precision, car effectivement Dream Weaver alourdi les codes et n'est pas toujours tres fiable niveau précision. Je savais que le code serais directement reconnu comme du DW, ............... je pense que aujourd'hui je vais tout fermer et ne lancer qu'un notepad ++ merci à vous deux.

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed