Créer un scroll

3 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Créer un scroll

Message par Horatio Dim 20 Nov 2011, 09:13

Bonjour à tous,

J'aimerais créer sur mon forum des scrolls mais je ne connais aucun code pour réaliser ceci.
Créer un scroll 88434092la-scroll-jpg
Pouvez vous m'aider ?

Merci à tous,
Cordialement
Horatio


Dernière édition par Horatio le Lun 21 Nov 2011, 07:05, édité 1 fois
Horatio

Horatio
*****

Masculin
Messages : 630
Inscrit(e) le : 05/05/2010

http://poudlardunivers.com
Horatio a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Créer un scroll

Message par SoraNoHime Dim 20 Nov 2011, 15:34

Bonjour Horatio.

Essayer ceci à placer ou voulu :
Code:
<div class="bidule"> texte </div>

et dans la css :
.bidule {
height : 150px;
width : 200px;
overflow : auto;
}

il n'y a plus qu'a règler la hauteur (height : 150px;) la longueur (width:200px;) le overflow créant l'apparition du scroll

Cordialement.
SoraNoHime

SoraNoHime
Membre actif

Féminin
Messages : 6218
Inscrit(e) le : 10/06/2010

SoraNoHime a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Créer un scroll

Message par kheino Dim 20 Nov 2011, 15:35

Re salut Horacio,

C'est (encore) du CSS et cette fois la propriété "overflow-y".

Tu crée une boîte sous forme de bloc (div) avec un class et un identifiant disons class="newscroll" (je sais, je sais, j'ai une imagination débordante aujourd'hui!) :
Code:
<div class="newscroll">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed vulputate mattis magna, ac adipiscing sapien fringilla sed. Nulla mollis ante nec nibh dictum pulvinar. Vivamus sit amet nisl mauris, ac vehicula velit. Donec fringilla suscipit lobortis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nulla facilisi. Suspendisse felis metus, varius quis auctor vitae, consequat eu urna. Nunc turpis ligula, lobortis sit amet convallis nec, fermentum eu nisl. Nunc iaculis, lacus in semper ultricies, ante felis sollicitudin sem, non dictum orci sapien at tellus. Ut sed enim quam, eget vestibulum purus. Phasellus tincidunt, eros nec dictum sollicitudin, dui sapien vehicula nisi, vel aliquet felis est in tortor.

 Sed ullamcorper rhoncus odio id pretium. Sed rutrum nibh sollicitudin velit consequat at gravida massa aliquam. Vestibulum quis enim libero. Donec imperdiet imperdiet erat in varius. Integer eget elit ut turpis venenatis facilisis nec sit amet nisl. Etiam quis feugiat dui. Fusce vel diam dui.

 Fusce hendrerit, tellus ac blandit ultricies, sem ante viverra libero, et malesuada lectus arcu eu mauris. Etiam sit amet lacus et mi commodo bibendum. Nulla porta iaculis enim, non molestie mauris euismod lacinia. Nullam orci massa, dictum sed mattis vitae, mattis a ante. Sed accumsan lectus sit amet elit tristique tempor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pretium gravida elit, sodales dignissim lacus ornare at. Morbi tempor commodo vestibulum. Pellentesque turpis sapien, varius quis semper vitae, convallis et tellus.

 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque at erat justo. Etiam neque justo, venenatis consectetur pretium vel, elementum eget velit. Nullam nunc felis, aliquet non aliquet at, consequat in elit. In at libero mi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nullam vel nulla vel felis aliquet pharetra. Aliquam tincidunt lobortis ipsum, nec pretium libero pulvinar nec. Nam ipsum ligula, hendrerit non vulputate ut, mattis et nisi. Nulla feugiat ultrices augue, non fermentum nisi auctor sit amet. Donec tristique faucibus erat. Donec adipiscing augue et lorem dictum interdum. Nullam tempor massa et turpis aliquam sodales. Quisque commodo nulla at magna suscipit vitae pretium massa adipiscing. Curabitur gravida vehicula quam, ut tristique ante pretium sit amet. Nulla accumsan tortor eget purus pharetra posuere.

 Maecenas congue imperdiet mauris non laoreet. Aenean lacus turpis, bibendum non scelerisque non, bibendum ut turpis. Morbi vel massa arcu. Cras a laoreet enim. Sed gravida congue ipsum, sed volutpat erat condimentum eu. Phasellus facilisis, tellus ut congue luctus, ligula mi dignissim elit, id facilisis lacus tortor a elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas libero lorem, feugiat nec commodo a, fermentum at dui. Vivamus non tortor massa, sed vestibulum lectus. Nam non tristique arcu. Sed augue mi, mattis non blandit vel, consequat eu ipsum. Nullam sed enim augue, eu bibendum felis. Donec ipsum dui, feugiat et luctus id, facilisis vel lacus.
</div>
Dans le CSS, nous utiliserons le scroll vertical, et pour ce faire, il suffit de donner au "div" une hauteur limitée afin que le scroll prenne le relai :
.newscroll {
width: 300px;
height: 170px;
overflow: auto;
text-align: justify;
border: 3px ridge #000000;
padding: 4px;
}
C'est ça que tu demandais ?

EDIT : Yiaaah, carambolage sous les topics... C'est ça de conduire et téléphoner en même temps... Gloups
kheino

kheino
Membre habitué

Féminin
Messages : 1698
Inscrit(e) le : 09/05/2010

http://www.siteduzero.com/
kheino a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Créer un scroll

Message par Horatio Lun 21 Nov 2011, 07:05

Bonjour,

Parfait c'est exactement ce que je demandais, merci à vous deux.
* J'ai mis "merci" à Macema comme elle à répondu la première et +1 pour final-blonde *

Bonne journée,
Horatio
Horatio

Horatio
*****

Masculin
Messages : 630
Inscrit(e) le : 05/05/2010

http://poudlardunivers.com
Horatio a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum