Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1200 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  mise en forme CSS

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

mise en forme CSS

n°793460
$man
Posté le 12-07-2004 à 12:03:55  profilanswer
 

salut,
je me lance dans le CSS, après avoir lu que la mise en forme avec des tableau, cai mal  :o  
seulement un petit probleme, et quelques questions ( :D )
deja voila le code :

Code :
  1. <html>
  2. <head>
  3.   <title>test CSS</title>
  4. <style>
  5. .menuhaut
  6. {
  7. float: left;
  8. width: 185;
  9. height: 39;
  10. background-image: url("php/newsite/haut.bmp" );
  11. }
  12. .menuback
  13. {
  14. float: left;
  15. width: 185;
  16. background-image: url("php/newsite/background.bmp" );
  17. }
  18. .menubas
  19. {
  20. float: left;
  21. width: 185;
  22. height: 50;
  23. background-image: url("php/newsite/bas.bmp" );
  24. }
  25. </style>
  26. </head>
  27. <body>
  28. <div class="menuhaut">
  29. </div>
  30. <br><br>
  31. <div class="menuback">
  32. tata<br>
  33. tete<br>
  34. titi<br>
  35. toto<br>
  36. tutu<br>
  37. tyty<br>
  38. </div>
  39. <br><br><br><br><br><br>
  40. <div class="menubas">
  41. </div>
  42. </body>
  43. </html>


 
et voila le résultat:
http://progimethodes.free.fr/css.png
c'est pas mal pour un debut :)
par contre pourquoi les menus haut et background sont mal assemblés (ligne blanche ?)
aussi y a t'il besoin de tout mes <br> pour que la partie du menu aille bien en dessou du précédent ?
aussi je voudrais que la partie background "s'allonge" selon la longueur du texte contenu a gauche (on m'a dit d'utiliser "repeat-y", mais dois-je l'associer à un background ?)
idéalement je voudrais avoir ca :
http://progimethodes.free.fr/menu.png
et pas ca :
http://progimethodes.free.fr/menupasbien.png
 
merci de votre aide  :jap:


Message édité par $man le 13-07-2004 à 11:09:47
mood
Publicité
Posté le 12-07-2004 à 12:03:55  profilanswer
 

n°794437
$man
Posté le 13-07-2004 à 11:11:03  profilanswer
 

:bounce:

n°794442
boulax
Inserer phrase hype en anglais
Posté le 13-07-2004 à 11:13:25  profilanswer
 


 
les br cai mal
 
et les bmp aussi :o


---------------
Posté depuis des chiottes, sales. Me gusta.
n°794443
Profil sup​primé
Posté le 13-07-2004 à 11:13:47  answer
 

img {display:block} pour les images

n°794444
boulax
Inserer phrase hype en anglais
Posté le 13-07-2004 à 11:14:51  profilanswer
 

Et pour ton histoire d'etirement, faut que les hauteurs soient corrélées, c'est a dire que les deux parties texte et menu doivent etre dans un meme conteneur div.


---------------
Posté depuis des chiottes, sales. Me gusta.
n°794448
$man
Posté le 13-07-2004 à 11:19:17  profilanswer
 

merci, de vos réponses!
bien evidenmment le bmp c'est parce que je suis en local, et comme je me suis pas encore arréter sur un design précis, je les laisse en bmp pour les modif sans perdre en qualité :)
avec  img {display:block} je pourrais écrire par dessus ?
merci


Message édité par $man le 13-07-2004 à 11:19:59
n°794453
boulax
Inserer phrase hype en anglais
Posté le 13-07-2004 à 11:21:38  profilanswer
 

img {display:block} s'utilises si t'as des balises <img> avec des espaces en dessous ce qui n'est pas ton cas pour l'instant. Je pense que ca vient plutot de tes <br> entre les divs.


---------------
Posté depuis des chiottes, sales. Me gusta.
n°794462
$man
Posté le 13-07-2004 à 11:26:37  profilanswer
 

merci,
je me documente :)

n°794514
$man
Posté le 13-07-2004 à 11:53:17  profilanswer
 

salut,
j'ai pas mal avancé, mais pour l'étirement je vois pas
j'ai bien mis le morceau de menu que je veut étiré dans le meme div que mon texte mais il se passe rien :

Code :
  1. <div>
  2. <div class="menuback">
  3. tata<br>
  4. tete<br>
  5. titi<br>
  6. toto<br>
  7. tutu<br>
  8. tyty<br>
  9. </div>
  10. <div class="contenu">
  11. salut<br>salut<br>salut<br>salut<br>salut<br>salut<br>salut<br>salut<br>salut<br>salut<br>
  12. salut<br>salut<br>salut<br>salut<br>salut<br>
  13. </div>
  14. </div>


Message édité par $man le 13-07-2004 à 11:53:35
n°794524
boulax
Inserer phrase hype en anglais
Posté le 13-07-2004 à 11:58:39  profilanswer
 

Bah il faut mettre une classe au conteneur aussi et jouer avec le positionnement, la hauteur et la largeur pour avoir l'effet désiré. Enfin c'est un peu prise de tête et les css montrent vite leur limites pour des mises en pages un peu complexe, c'est pour cela que j'utilise des tableaux  pour ma mise en page.  
 
En tout les cas, on t'as surement deja parlé de ce site, il possède de bon tutoriaux css pour le positionnement et l'émulation de frames.
http://www.alsacreations.com/articles/


Message édité par boulax le 13-07-2004 à 11:59:07

---------------
Posté depuis des chiottes, sales. Me gusta.
mood
Publicité
Posté le 13-07-2004 à 11:58:39  profilanswer
 

n°794582
$man
Posté le 13-07-2004 à 12:30:36  profilanswer
 

ok, mais meme avec les tableau je ne sais pas faire!
au debut je voulais faire ca mais je n'y suis pas arrivé :(
sur ce je vais aller déjeuner :o
bon app @ tous les lecteurs


Message édité par $man le 13-07-2004 à 12:30:53
n°799443
$man
Posté le 19-07-2004 à 11:46:36  profilanswer
 

personne n'a une idée :(


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  mise en forme CSS

 

Sujets relatifs
[CSS] 100%-10px pas bon?image et CSS
problème de CSS et arrière plan[CSS] Comment éviter de tel chose si horrible ?! [Résolu]
[HTML/CSS] Menu dynamiqueAide pour un CSS qui creer du blanc
[html/css] aligner à gauche et à droite dans une même cellule[CSS] Espace dans un tableau
[CSS] Probleme de mise en forme...Positionnement HTML/CSS + Mise en forme des cadres
Plus de sujets relatifs à : mise en forme CSS


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR