Forum Programmation.web scroll : la largeur du contenu ne s'adapte pas

Posté par  .
Étiquettes : aucune
0
8
août
2008

Bonjour, 



je reviens avec encore une question HTML/CSS relative aux scroll & overflow...






J'ai un conteneur, de largeur fixe, et une barre de scroll si le contenu est trop large.






Le contenu n'a pas de largeur fixe.






Par défaut, le contenu prend la largeur du conteneur. Le texte du contenu dépasse, la scrollbar du conteneur apparaît.






Le problème, c'est que la taille du contenu reste à sa valeur originale, c'est à dire la largeur du conteneur sans scroll.






Moi, je voudrais que le conteneur ait toujours la largeur maximale, scroll compris.






Voici un exemple minimal :








< html >


	< head >


		< style type="text/css" >


			#container { background-color: #00FF00; width: 150px; overflow: auto }


			#content { background-color: #FF0000; white-space: nowrap; }


		< /style >


	< /head >


	< body >


		< div id="container" >


				< div id="content" >Hello World Foo Bar Dev Null< /div >


		< /div >


	< /body >


< /html >









et les captures d'écran associées :






http://img365.imageshack.us/img365/1305/screenshot015rk0.png






http://img295.imageshack.us/img295/84/screenshot016qu2.png






Sur la deuxième capture, on voit que le contenu (fond rouge) a conservé la taille du conteneur (fond vert) avant scrolling.






Or je voudrais que le contenu s'élargisse au maximum.






J'ai essayé width: 100%, mais ça ne marche pas.






Merci d'avance pour vos suggestions !









    

  • 

    

#
 
je comprend pas ton probleme

    

    
Posté par  .
Évalué à 1.

    

    

    

	tu as un texte fixe dans un contenant plus petit
    

    
le contenant te propose de scroller pour voir la suite
    
et c'est ce qu'il se passe
    

    
tu scrolles de 6 caracteres à droite et ca enleve bien 6 caracteres à gauche.

    

    

    


      

    • 

      
[^]
#
 
Re: je comprend pas ton probleme

      

      
Posté par  .
Évalué à 2.

      

      

      

	Je me suis mal exprimé.
      

      
En fait je voudrais que le contenu (div à fond rouge) s'étale complètement dans le conteneur. Autrement dit qu'il soit aussi large que le texte. C'est pour ça que je ne spécifie pas manuellement sa largeur en px...
      

      
Sur le deuxième screenshot, d'après ce que je voudrais, le fond rouge devrait s'étaler jusqu'au bout, on ne devrait pas voir le fond vert du conteneur apparaître.

      

      

      


        

      • 

        
[^]
#
 
Re: je comprend pas ton probleme

        

        
Posté par  .
Évalué à 1.

        

        

        

	ne pas mettre de couleur differente entre le fond et la forme (contenu/contenant)
        

        
voire ne pas mettre du tout de couleur et laisser la couleur du fond faire son travail

        

        

        



        • 


      

      • 


    

    • 


  • 

    

#
 
min-width

    

    
Posté par  .
Évalué à 1.

    

    

    

	Et en jouant avec les propriétés CSS min-width / max-width ?

    

    

    


      

    • 

      
[^]
#
 
Re: min-width

      

      
Posté par  .
Évalué à 2.

      

      

      

	salut MilkaJinka,
      

      
j'ai également essayé, mais ça ne suffit pas :s

      

      

      


      • 


    

    • 





Suivre le flux des commentaires




Note :
les commentaires appartiennent à celles et ceux qui les ont postés. Nous n’en sommes pas responsables.