Création
d'entreprise
Posez votre question Signaler

[CSS] overflow : scroll [Résolu]

kij_82 4070Messages postés 7 avril 2005Date d'inscription 24 septembre 2010Dernière intervention - Dernière réponse le 13 oct. 2011 à 10:05
Bonjours,

J'ai un ami qui me demandais cela, mais vu que ca fait pas mal de temp que je ne touche plus aux mise en page et que j'ai un peu une mémoire de poisson rouge... je me demandais si certain d'entre vous pouvais m'en dire plus sur son problème.

Voilà, dans un site, en page d'intro, il veut faire un petit encadré avec du texte dedans. L'encadré ne doit pas dépasser une certaine taille et donc il faut que les scrollbar s'active en fonction de la longueur du contenu.

Voici son code :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>page d'acceuil</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
p{
heigth: 100px;text-align:justify;
}
.coupe{
overflow:scroll
}
</style>
</head>
<body>
<p class="coupe">

<br />
<font color="#ffffff">
// Un texte Bidon d'un certain nombre de lignes
</font>

<br />
</p>
</body>
</html>


Voilà, le résultat de ce code est que le texte apparait bien mais l'encadré est élargi à l'ensemble du texte et devient donc trop grand - au lieu de faire les taille indiquées dans la classe.

Sauriez vous pourquoi et comment remédier à cela ?

Merci d'avance à vous. :)
Lire la suite 

[CSS] overflow : scroll »

8 réponses
Réponse
+8
moins plus
je te conseille un overflow:auto;

Comme ça si le contenu ne dépasse pas du cadre, la barre de défilemenent n'apparaît pas.
Ajouter un commentaire
Réponse
+4
moins plus
Met tes balies <p> dans une div avec une height definie et en overflow:auto
Ajouter un commentaire
Réponse
+2
moins plus
Il semble que la propriété "overflow:auto" ne fonctionne pas sous iphone ipod et ipad.
Sinon cela est la meilleur solution, ça marche même sous IE.....
Ajouter un commentaire
Réponse
-2
moins plus
C'est un peu vieux, mais quand même. :p

coupe{
overflow:scroll
} 


Il manque simplement le point virgule à la fin je pense. ^^

Et en passant la balise font c'est bof. Il faudrait plutot définir la couleur dans le css :
p {
   heigth: 100px;
   text-align: justify;
} 
.coupe {
   overflow: scroll;
   color: white;
}
BloodyAngel- 22 janv. 2011 à 03:24
Pareil que SitaJONY... j'arrive quelques années après la guerre ^^
Mais bon j'voulais juste remercie Artis.psyko pour sa réponse. Je sais pas si elle a aidé la personne qui a posté en premier, mais moi ça m'aide beaucoup.
Mon problème c'est que j'avais une table trop grande qui obligeait mon <div> à passer en dessous du reste quand elle était affichée.
Maintenant avec overflow: scroll j'ai une scrollbar et ma table reste en place ^^
Ajouter un commentaire
Réponse
-3
moins plus
salut,

ton message date de loin mais je suis tombée dessus et ne peut m'empêcher d'y répondre...
ce n'est pas 'heigth' mais 'height' qu'il faut ! lol

allez, bye
Ajouter un commentaire
Réponse
-4
moins plus
Edit : Problème résolu : faut pas mettre ca dans une classe mais dans un style...

Merci à vous :)
Ajouter un commentaire
Réponse
-4
moins plus
Houa un vrai hasard que je passe ici mdr je sais même plus pourquoi je suis venu lol.
Je savais pas qu'on pouvait ajouter un scrollbar dans une balise, je savais qu'on pouvais supprimer le scrollbar d'une page mais pas ajouter/supprimer d'un objet DIV...
Sa va beaucoup m'aider pour mon Chat maintenant jèspère qu'on peut récuperer la valeur du scroll même pour un DTD Strict XHTML 1.0...
overflow tout simplement et moi qui galerais à mettre le chat en pleine ecran et supprimer le scrollbar de la page pour pas qu'on voit les conversations dépasser XD... Bon je me comprend merci :D
Ajouter un commentaire
Ce document intitulé « [CSS] overflow : scroll » issu de CommentCaMarche (www.commentcamarche.net) est mis à disposition sous les termes de la licence Creative Commons. Vous pouvez copier, modifier des copies de cette page, dans les conditions fixées par la licence, tant que cette note apparaît clairement.
Dossier à la une
Passage au tout numérique : quel coût pour les particuliers ?