Se passer complètement des tableaux pour la mise en page.

Se passer complètement des tableaux pour la mise en page. - Web design - Graphisme

Marsh Posté le 28-06-2006 à 05:55:14    

bonjour à tous
 
 Je suis en train de réécrire mon site. J'avais déja décider de virer tous les frames, iframes
 les remplacer par des overflow, et des includes php.
 
 Maintenant je suis en train de réécrire mes fichiers car je me rends compte que il n'y a pas besoin de tableaux pour le positionnement d'éléments certains sites n'utilisent plus du tout de tableaux pour positionner des graphs ou animations il n'utilise du code css dans la totalité mais je n'arrive pas à positionner en css des éléments  
flash
 
 Je sais positionner des Jpg gif et autres extensions mais pas les swf pouvez vous m'aider ?
 

Code :
  1. Fichier CSS
  2. body
  3. {
  4. background: #333333;
  5. color: #000000;
  6. font: 9pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
  7. margin: 0 10px 10px 115px;
  8. padding: 0px;
  9. }
  15. .head {
  16. background-image: url('head.jpg');
  17. width: 800px;
  18. height: 115px;
  19. }
  23. .menu {
  24. background-image: url('menu.jpg');
  25. width: 770px;
  26. height: 106px;
  27. }
  29. .body {
  30. background-image: url('body.jpg');
  31. width: 770px;
  32. height: 350px;
  33. }
  35. .bottom {
  36. background-image: url('bottom.jpg');
  37. width: 770px;
  38. height: 57px;
  39. }
  43. div#bloc1 {
  44. background: #FFFFFF;
  45. width: 770px;
  46.        height: 350px;
  47.        overflow: auto;
  49. }
  53. a:link {color: #000000;
  54.         font-weight: bold;
  55.         }
  56. a:visited {color: #000000;
  57.          font-weight: bold;
  58.   
  59.         }
  60. .accueil {
  61.         font-family: Verdana, Arial, Helvetica, sans-serif;
  62.         font-size: 10px;
  63.         color: #000000;
  64.         margin-top: 10px;
  65.         text-align: justify;
  66.         width: 640px;
  67.         background-color: #F0F0F0;
  68.         border: 1px solid #333333;
  69.         padding: 1em;
  70.         line-height: 150%;
  71. }


 

Code :
  1. Fichier index.php
  3.   <html>
  4. <head>
  5. <title>mon site</title>
  6. <link href="style_center.css" rel="stylesheet" type="text/css" />
  7. </head>
  9. <body>
  10. <div class="head"></div>
  11. <div class="menu"></div>
  12. <div class="body">
  13. <div id="bloc1">
  14.  <div align="center">
  15.   <?php include("main_modul.so" ); ?>
  16.                 </div>
  17.         </div>
  18. </div>
  19. <div class="bottom"></div>
  20. </body>
  21. </html>


 
Merci de votre aide  :)


Message édité par luxylux le 28-06-2006 à 06:02:41
Reply

Marsh Posté le 28-06-2006 à 05:55:14   

Reply

Marsh Posté le 28-06-2006 à 08:14:09    

Un flash ca se trouve dans une balise object, si tu as un flash sur ta page ben tu lui colles un id et tu y accèdes en CSS par #flashid
 
plus serieusement tu aurais un visuel de ce que tu cherches à obtenir ?

Message cité 1 fois
Reply

Marsh Posté le 28-06-2006 à 08:34:09    

gatsu35 a écrit :

Un flash ca se trouve dans une balise object, si tu as un flash sur ta page ben tu lui colles un id et tu y accèdes en CSS par #flashid
 
plus serieusement tu aurais un visuel de ce que tu cherches à obtenir ?


http://www.enfantskdos.fr/sidyjonline/so/screen.jpg
 
 mes icons, le menu flash et l'animation flash sont positionés dans un tableau c'est ce que je voudrais changé pour alleger le code final car j'arrive a voir le meme résultat sans le tableau pour le reste et le code est tres legé il est affichier plus haut. sauf que si je retire mon tableau plus de flash et plus d'icons.
 

Reply

Marsh Posté le 29-06-2006 à 10:09:13    

Je suis parvenu à placé mon menu et mon animation flash en CSS mais je ne comprends pas pouquoi je suis obligé de donné une valeur négative pour positionner mon menu flash. Quand je mettais une valeur positive ca foutais tout le design en l'air.  
 

Code :
  1. "Fichier CSS"
  3. .menu {
  4. background-image: url('menu.jpg');
  5. width: 770px;
  6. height: 103x;
  7. }
  9. .flashmenu {
  10. margin-top: -30px;  /* <---------- ICI*/
  11. margin-left: 25px; 
  12. border: 0;
  13. }
  15. .blackanimation {
  16. margin-left: 513px; 
  17. border: 0;
  18. }


 

Code :
  1. <html>
  2. <head>
  3. <link rel="stylesheet" type="text/css" media="all" href="style_center.css">
  4. </head>
  5. <body>
  6. <div class="head"></div>
  7. <div class="menu">
  9. <div class="blackanimation">
  10. <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
  12. codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0
  14. ,0" width="233" height="103">
  15.           <param name=movie value="sidyjonline_black_animation.swf">
  16.           <param name=quality value=high>
  17.           <embed src="sidyjonline_black_animation.swf" quality=high
  19. pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=Shockwa
  21. veFlash" type="application/x-shockwave-flash" width="233" height="103">
  22.           </embed>
  23.         </object>
  24. </div>
  26. <div class="flashmenu">
  27. <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
  29. codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0
  31. ,0" width="440" height="25">
  32.           <param name=movie value="sidyjonline_menu.swf">
  33.           <param name=quality value=high>
  34.           <embed src="sidyjonline_menu.swf" quality=high
  36. pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=Shockwa
  38. veFlash" type="application/x-shockwave-flash" width="440" height="25">
  39.           </embed>
  40.         </object>
  41. </div>
  42. </div>
  43. <div class="body">
  44. <div id="bloc1">
  45.  <div align="center">
  46.   <?php include("main_modul.so" ); ?>
  47.                 </div>
  48.         </div>
  49. </div>
  50. <div class="bottom"></div>
  51. </body>
  52. </html>


Message édité par luxylux le 29-06-2006 à 10:10:15
Reply

Sujets relatifs:

Leave a Replay

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