Signaler

Décalage de points de suspenssion [Résolu]

Posez votre question Fatiiza 4Messages postés jeudi 1 septembre 2016Date d'inscription 8 septembre 2016 Dernière intervention - Dernière réponse le 8 sept. 2016 à 11:49
Bonjour,
j'ai besoin de votre aide,
j'ai besoin de faire les points de suspenssion quand les le text est trés long, mais les points sont trés décaler de texte avec le code css que j'utilise,
content: '...';
position: absolute;
right: 0px;
bottom: 0px;
quand je change la balise right, il m'affiche les points pour les autres text qui ne sosnt pas long :/ j'ai besoin de votre aide c urgent ^^
Afficher la suite 
Utile
+1
moins plus
Salut,

Il faudrait idéalement voir le code html correspondant pour pouvoir t'aider au mieux.

Si tu veux que les '...' s'affiche après le texte, tu ne devrais pas utiliser de position absolute mais laisser la position par défaut. Exemple :
/* css */
.text:after {
  content: '...';
}

<!-- html -->
<div class="text">
  lorem ipsum dolor sit amet
</div>


Bonne journée,
Fatiiza 4Messages postés jeudi 1 septembre 2016Date d'inscription 8 septembre 2016 Dernière intervention - 1 sept. 2016 à 12:55
oui ça marche quand j'enléve absolute mais les points s'apparaient pour tout les titres que ça soit court ou bien long ! je veux que s'apparait juste si le text est trés long par exemple quand il dépasse 2lignes ?
Répondre
Pitet 1923Messages postés lundi 11 février 2013Date d'inscription 26 septembre 2016 Dernière intervention - 1 sept. 2016 à 14:18
Je ne pense pas que cela soit possible en css (compter le nombre de mots ou ligne).

Il faudrait utiliser un langage serveur comme php ou utiliser javascript pour compter le nombre de caractère et appliquer une classe css spécifique pour les textes long. On pourra alors appliquer le code css ci-dessus sur cette classe css.
Répondre
Fatiiza 4Messages postés jeudi 1 septembre 2016Date d'inscription 8 septembre 2016 Dernière intervention - 1 sept. 2016 à 14:41
Merci bcp Pitet :)
peux tu m'écrire le code javascritp correspend a ce que tu viens de m'expliquer ?
Répondre
Pitet 1923Messages postés lundi 11 février 2013Date d'inscription 26 septembre 2016 Dernière intervention - 1 sept. 2016 à 16:08
N'ayant pas ton code html, voici un exemple simple en utilisant javascript :
<!-- html -->
<div class="text">
Lorem ipsum dolor sit amet
</div>
<div class="text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet massa accumsan, dignissim ex eu, fringilla leo
</div>
<div class="text">
Lorem ipsum dolor sit amet, consectetur adipiscing elit
</div>

// nombre de caractère à partir duquel on ajoute '...'
var maxLength = 100;

// on récupère tous les éléments class="text"
var textElements = document.querySelectorAll('.text');

// pour chaque éléments class="text"
for (var i = 0; i < textElements.length; ++i) {
  // si le contenu textuel de l'élément est plus grand que maxLength
  if (textElements[i].innerHTML.length > maxLength) {
    // on ajoute '...' à la fin du contenu de l'élément
    textElements[i].innerHTML += '...';
  }
}
Répondre
Fatiiza 4Messages postés jeudi 1 septembre 2016Date d'inscription 8 septembre 2016 Dernière intervention - 8 sept. 2016 à 11:49
Merci infinément Pitet :) ça marche bien
Répondre
Ajouter un commentaire

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !