Probleme ascenseur et overflow

Probleme ascenseur et overflow - HTML/CSS - Programmation

Marsh Posté le 03-04-2006 à 22:21:34    

Bonjour,
 
Je travaille sur un site et j'ai un leger probleme avec le positionnement de mon texte.  
Donc le but est d'avoir une image de fond et sur la droite de l'image le texte que je veux (inclusion d'une page php). J'ai un fond blanc transparent sur lequel j'ecris et qui a été ajouté en dur dans photoshop. Cependant quand je deplace mon ascenseur mon texte sort de ce cadre blanc.
Voici mon code, j'imagine que l'erreur vient de la ou que je m'y prend mal... Et une petite illustration du probleme :
 

Code :
  1. <body>
  3. <div id="image_fond">
  4.    <div id="cadre_accueil">
  5.  <div id="contenu_accueil">
  6.   <?php include ('accueil.php'); ?>
  7.  </div>
  8. </div>
  9. </div>
  10.  
  11. </body>


 

Code :
  1. body {
  2. font-family: Verdana, Arial, Helvetica, sans-serif;
  3. font-size: 0.8em;
  4. margin: 0;
  5. padding: 0;
  6. /*Couleurs de l'ascenseur*/
  7. scrollbar-face-color: #E0D9C7;
  8. scrollbar-shadow-color: gray;
  9. scrollbar-darkshadow-color: gray;
  10. scrollbar-track-color: #625645;
  11. }
  12. #image_fond, #cadre_accueil {
  13. width: 800px;
  14. height: 530px;
  15. }
  16. #image_fond {
  17. position: absolute;
  18. top: 30px;
  19. left: 50px;
  20. background-image:url("../Images/fond.jpg" );
  21. background-position: top left;
  22. background-repeat: no-repeat;
  23. color: black;
  24. }
  25. #cadre_accueil {
  26. border: none;
  27. overflow: auto;
  28. }
  29. #contenu_accueil {
  30. padding: 150px 0 0 50px;
  31. margin: 10px;
  32. margin-right: 450px;
  33. margin-bottom: 60px;
  34. }


 
Merci :)


Message édité par Loizo le 05-04-2006 à 19:43:12
Reply

Marsh Posté le 03-04-2006 à 22:21:34   

Reply

Marsh Posté le 04-04-2006 à 08:57:42    

L'ascenseur devrait alors plutôt se trouver dans la zone blanche, non ? Genre positionne ton texteen position absolue pour qu'il se cale bien sur la zone blanche (position absolue, mettre les bonnes valeurs pour top, left, width et height + un overflow auto)...

Reply

Marsh Posté le 04-04-2006 à 13:36:44    

MErci de ta réponse, j'avais fait ca au départ, ce qui fait que je n'avais pas ce bug.
Mais si je fais ca alors quand je redimentionne la fenetre du navigateur l'overflow ne se place plus ou il faut...
C'est pour ca que j'utilise mon image comme un fond pour l'overflow.
 
Mais ca me tue c'est un truc assez classique que je fais mais je n'y arrive pas. Je dois avoir louper un truc :/

Reply

Marsh Posté le 05-04-2006 à 12:37:28    

Personne ? :(

Reply

Marsh Posté le 05-04-2006 à 12:41:56    

Normalement, quand tu redimensionne, le bloc ne devrait pas bouger... Ca dépend par rapport à quoi il est positionné. Met son élément parent en position relative, histoire de voir...

Reply

Marsh Posté le 05-04-2006 à 14:33:58    

En fait a priori si je met la photo en position absolute ainsi que l'overflow en position absolute, ils se placent tout les deux par rapport au coin de l'ecran. Donc si je redimentionne l'overflow n'est plus placé au meme endroit :/  
Je vais tenter comme tu dis ce soir, faut que je revois tout mon truc vu que la ca ne colle plus. J'espere que ca va marcher, merci :)

Reply

Marsh Posté le 05-04-2006 à 19:47:08    

Nickel ca marche avec la position relative !! Merci :)

Reply

Sujets relatifs:

Leave a Replay

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