Probleme de disposition en CSS

Probleme de disposition en CSS - HTML/CSS - Programmation

Marsh Posté le 24-09-2008 à 15:37:46    

Bonjour,
 
J'ai un petit probleme concernant la disposition en CSS
Mon but est de créer une petite page avec les éléments suivants :
1 image
1 player
1 synopsis
1 cadre langue
 
J'aimerais ensuite les disposer de la manière :
L'image et le player sont l'un au dessus de l'autre puis le cadre du sypnosis et le cadre langue doit être l'un au dessus de l'autre sur une colonne à coté.
 
Voici le code qui permet de faire ceci :

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  5. <title>Document sans titre</title>
  6. <style type="text/css">
  7. .image {
  8. height: 180px;
  9. width: 240px;
  10. margin-left:115px;
  11. margin-top: 70px;
  12. float:left;
  13. }
  14. .synopsis {
  15. width:350px;
  16. height:240px;
  17. margin-left:30px;
  18. margin-top: 70px;
  19. /*background-color:#FFFF00;*/
  20. border-left:1px solid #000000; /* couleur du cadre */
  21. border-right:1px solid #000000;
  22. border-bottom:1px solid #000000;
  23. border-top:1px solid #000000;
  24. float:left;
  25. }
  26. .clearboth { clear: both; }
  27. .video {
  28. height: 320px;
  29. width: 240px;
  30. margin-left:45px;
  31. margin-top: 15px;
  32. float:left;
  33. }
  34. .langue {
  35. width:350px;
  36. height:240px;
  37. margin-left:100px;
  38. margin-top: 15px;
  39. /*background-color:#FFFF00;*/
  40. border-left:1px solid #000000; /* couleur du cadre */
  41. border-right:1px solid #000000;
  42. border-bottom:1px solid #000000;
  43. border-top:1px solid #000000;
  44. float:left;
  45. }
  46. </style>
  47. <body background="fond_popup.png">
  48. <div class="image">
  49. <img name="img" src="test.png" alt="" border="2">
  50. </div>
  51. <div class="synopsis">
  52. <center><b>SYNOPSIS</b></center>
  53. </div>
  54. <br class="clearboth">
  55. <div class="video">
  56. <object type="application/x-shockwave-flash" data="player_flv.swf" width="320" height="240">
  57. <param name="movie" value="player_flv.swf" />
  58.     <param name="FlashVars" value="flv=test.flv&amp;loop=1&amp;autoplay=1" />
  59. </object>
  60. </div>
  61. <div class="langue">
  62. <input type="button" value="Fermer" onClick="window.close();" name="button">
  63. </div>
  64. </body>
  65. </html>


 
Maintenant j'aimerais agrandir le cadre synopsis et diminuer le cadre langue.
Malheureusement lorsque j'augmente la taille du cadre synopsis, la vidéo est aussitôt décalée .
 
Comment puis je faire cela ?
Merci

Reply

Marsh Posté le 24-09-2008 à 15:37:46   

Reply

Marsh Posté le 24-09-2008 à 18:50:47    

Salut,
 
Est-ce que tu peux avoir un imprime écran de ta page et l'afficher stp . Ca aidera à comprendre...
 
Merci
A Plutard

Reply

Sujets relatifs:

Leave a Replay

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