Précédent   Forum des professionnels en informatique > Webmasters - Développement Web > CSS
CSS Forum d'entraide sur l'utilisation des feuilles de style CSS. Avant de poster : Cours CSS, FAQ CSS, Galerie CSS
Partagez cette discussion sur d'autres réseaux sociaux : Viadeo Twitter Google Facebook Digg Delicious MySpace Yahoo
Réponse Proposer ce sujet en actualité
 
Outils de la discussion
Publicité
'
Vieux 14/01/2011, 08h29   #1
Membre du Club
 
Sylvain
Inscription : avril 2002
Messages : 132
Détails du profil
Informations personnelles :
Nom : Sylvain
Localisation : Canada

Informations forums :
Inscription : avril 2002
Messages : 132
Points : 57
Points : 57
Envoyer un message via MSN à Sylvain245
Par défaut Débordement auteur bloc

Bonjour,

J'ai un bloc contenant une description de longueur variable, et donc la hauteur de bloc augmente selon les besoins.

Hors, lorsque que la description est trop longue, je met un overflow:hidden au bloc. J'aurais aimer savoir, s'il est possible en css, d'afficher des '...' lorsque la hauteur d'un bloc dépasse le max-height

Pour un exemple, voir la page d'accueil de mon site web

http://www.all-game-event.com

la technique du text-overflow ne semble pas fonctionner.

Merci
Sylvain245 est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 14/01/2011, 09h26   #2
Rédacteur/Modérateur
 
Homme Jérome Debray
Responsable de projet
Inscription : mai 2009
Messages : 627
Détails du profil
Informations personnelles :
Nom : Homme Jérome Debray
Âge : 32
Localisation : France

Informations professionnelles :
Activité : Responsable de projet
Secteur : High Tech - Multimédia et Internet

Informations forums :
Inscription : mai 2009
Messages : 627
Points : 3 064
Points : 3 064
pour pouvoir utiliser le text-overflow:ellipsis, il faut rajouter white-space:nowrap;

Exemple pour ton code:

Code css :
1
2
3
4
5
6
7
8
9
10
11
12
p.descriptionDuJeu {
   font-size: 1em;
   line-height: 1.2em;
   margin: 0.5em 1em 0em;
   max-height: 7.7em;
   overflow: hidden;
   position: relative;
   text-align: left;
   text-overflow: ellipsis;
   white-space: nowrap;
}

Par contre le problème c'est que tu n'auras qu'une seule ligne suivi de '...' et là je n'ai pas encore de solution pour cela.
ornitho13 est déconnecté   Envoyer un message privé Réponse avec citation 00
Réponse Proposer ce sujet en actualité
Outils de la discussion



Fuseau horaire GMT +2. Il est actuellement 00h32.


 
 
 
 
Partenaires

Hébergement Web