Se connecter / S'enregistrer
Votre question

blocks qui s'empilent

Tags :
  • Programmation
Dernière réponse : dans Programmation
16 Juin 2005 20:19:52

voila ma page: http://tipaldi.free.fr

mes 3 menus a gauche s'empilent ! (si vous avez IE, vous ne les voyez pas c'est normal :p )

voici leur script: ici (j'arrive pas a metre le code sur se post :p )

pourkoi ils s'empilent, que faire ? (je veut que chaque munu s'espace de 10 pixels, j'ai voulu faire ca ac "margin-bottom: 10px")

ha oui et aussi 2eme pb: j'ai mis "overflow: auto" et "max-height : 300px" pour qu'ils ne fassent pas 3 km de long, mais ils font qhand meme 3km de long si on ecrit trop de trucs !!!

Autres pages sur : blocks empilent

16 Juin 2005 20:26:28

Bonjour a toi.
le fait de mette margin-bottom ne marche pas pour la simple et bonne raison que bottom = haut et donc il va mettre tous tes blocks en haut de ta page. Ils seront donc empilés.
Il faut que tu mettes pour ton second block,
margin-bottom: nb de pixels jusqu'au bas de ton premier block + 10 px.
Et donc pour le dernier,
margin-bottom: nb de pixels jusqu'au bas de ton second block + 10px.

Normalement ca devrait marcher.
Bonne chance pour ton site.
16 Juin 2005 20:30:08

merci mais comme la taille des blocks est variable en fonction des leur contenu, spa faisable... :p 
le veu juste un truc qui mette les bloks les uns en desous des autres avec 10 pixels d'espace...

ps: bottom = bas ;-)
ps2: et pour ma 2eme kestion ?
ps3: thx
Contenus similaires
16 Juin 2005 20:50:58

Dsl je suis crevé ...
Oui bottom = bas mais comme j'ai vu tes blocks en haut de ma page ................. (si ce sont bien les blocks news, ....)

Et puis bah du coup je vois plus omment faire pour tes blocks ...
Ah si !
J'ai peut etre une idée.
Essaie de mettre tes blocks sous forme de tableau en HTML. Tu fais
  1. <table cellspacing=10><tr><td><? include "block1.php"; ?></td></tr><tr><td><? include "block2.php"; ?></td></tr><tr><td><? include "block3.php"; ?></td></tr></table>


Et pour chacun de tes blocks tu crées un fichier .css pour les mettre en forme.

J'espere que j'ai pas dit un truc un poil trop !§?%£$ ;-)
16 Juin 2005 20:54:25

heu... une autre idée peut-etre ?
paske ca doit bien etre possible sans tout se bordel nan ?!

ps: la il sont plus empilés paske je les ai placés, mai j'aimerai bien k'ils se placent tt seuls les un O dessus des otres a 10 px d'intervale...

et aussi pourkoi max-height: 300 ne marche pas ?
16 Juin 2005 21:13:55

Je sais pas pourquoi ca marche pas .
Enfin bon je prends le code de la page et j'essaie de voir pour que ca marche.
Et si je reussis, je t'expliqerais ce qui n'allait pas.
Ca te convient ?
16 Juin 2005 23:23:34

salut,

c'est vraiment le bordel ton code ! t'a du pot que ça marche ! (edit: continue comme ça et personne ne va plus se pencher sur tes problemes)

modif pour afficher tes boites (en local chez moi ça roule) en fait je t'ai viré des trucs !
  1. <title>[CJTV] :: BIENVENU.wmv</title>
  2.  
  3.  
  4. <style type="text/css">
  5. table
  6. {
  7. position: absolute; margin-left: 0px; margin-top: 0px; z-index: 2; width:100pt; position: fixed
  8. }
  9. </style>
  10.  
  11. <table cellspacing=0><tr><td> <style type="text/css">
  12. fieldset
  13. {
  14. margin-left: 5px; margin-top: 5px; z-index: 2; background-color: orange; color: black; font-size: 11px; font-family:arial; padding: 5px; width:100pt; position: fixed; text-align: justify; border: 3px outset black;
  15. }
  16. </style>
  17.  
  18. <fieldset style="margin-top: 5px">
  19. <legend style="z-index: 2; font-size: 12px; color: grey; font-weight: bold;"> NewsLetter : </legend>
  20.  
  21. <form method="post" action="newsletter.php">
  22. je souhaite recevoir un mail m'informant de l'ajout d'une nouvelle video...
  23.  
  24. mon e-mail ou hotmail:<br/>
  25. <input type="mail" size="15" name="message" />
  26.  
  27. 7 inscrits<br/><input type="submit" value="inscription" />
  28. </fieldset></form></td></tr><tr><td> <style type="text/css">
  29. fieldset
  30. {
  31. margin-left: 5px;
  32. margin-top: 5px;
  33. padding:5px;
  34. background-color: orange;
  35. color: black;
  36. font-size: 11px;
  37. font-family:arial;
  38. width:150px;
  39. position: fixed;
  40. text-align: justify;
  41. border: 3px outset black;
  42. }
  43. </style>
  44.  
  45. <fieldset style="margin-top: 175px">
  46. <legend style="overflow: auto; z-index: 2; font-size: 14px; color: grey; font-weight: bold;"> Mini Chat : </legend>
  47. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  48.  
  49. <html style="overflow: auto" xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
  50. <head>
  51. <title>[CJTV] :: mini-chat</title>
  52. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  53. </head>
  54. <style type="text/css">
  55. form
  56. {
  57. text-align:center;
  58. }
  59. </style>
  60.  
  61. <body bgcolor=black>
  62.  
  63.  
  64.  
  65.  
  66.  
  67.  
  68. <form style='font-size:8.0pt' action="CJTV00.php?video=BIENVENU.wmv" method="post">
  69. <a style='font-size:8.0pt;color:white'>Pseudo :</a>
  70. <input type="text" size="7" value="" name="pseudo" />
  71.  
  72. <a style='font-size:8.0pt;color:white'>Message :</a>
  73. <input type="text" size="15" name="message" />
  74.  
  75. <input type="submit" value="Envoyer" checked="checked" /><input type="submit" value="Actualiser" />
  76. </form>


si t'epure pas ton code et que tu ne ressort pas ton css, laisse tomber le "xhtml" et tourne toi vers une page a tableau en dhtml (tu auras moins de problemes) vu que tu as l'air d'apprecier le javascript.

bon courage !

16 Juin 2005 23:38:18

rha merci beaucoup !
Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS