2009-12-08 3 views
16

J'ai une liste HTML non ordonnée (ul). Si le second mot est trop long, la ligne s'enroule automatiquement mais le texte qui déborde n'est pas indenté. Des idées pour résoudre ce problème?li li li est trop long, la ligne s'enroule mais aucune indentation

Voici l'exemple: http://tinyurl.com/yk32ek6 Puis "Leistungen" puis cliquez sur KINDERZAHNHEILKUNDE. Maintenant vous voyez ce que je veux dire.

Probablement c'est à cause du CSS, je ne sais pas à ce sujet.

+4

L'URL exemple que vous avez fourni n'a plus la question ... sa valeur à l'aide jsFiddle pour démontrer la question au lieu d'un site Web réel qui pourrait changer – Teevus

Répondre

32

Remplacer votre tiret avec un rembourrage

padding-left: 2em; 
text-indent: -2em; 

devrait faire l'affaire

+0

text-indent a fait l'affaire. Merci à tous pour votre aide, nickf de cette façon est super, je vais l'utiliser la prochaine fois. @sarfraz juste en changeant la taille n'est pas ce que je veux, toute la mise en page serait modifiée en flottant. – rdesign

-2

Cela se produit parce que le mot Prophylaxe in der Schwangerschaft est trop long pour tenir dans cette barre latérale. Vous devez augmenter la largeur de la barre latérale contenant votre liste.

La seule autre solution consiste à réduire la taille de la police de sorte que même les mots comme ci-dessus soient affichés en fonction de la largeur de la barre latérale.

EDIT S'il vous plaît laissez-moi savoir si mes réponses sont correctes ou non, car j'ai une certaine croyance de cette raison, même si quelqu'un m'a marqué; alors s'il vous plaît laissez-moi savoir si je me trompe en l'essayant. grâce

+0

Je pense que la personne a probablement voté pour vous parce que vous avez insisté sur le fait que rdesign avait besoin de changer ce à quoi il voulait que son site ressemble, quand il y avait en fait un moyen pour lui d'obtenir l'effet qu'il désirait. Voter n'est pas nécessairement une punition pour vous, mais plutôt une façon d'avertir les téléspectateurs potentiels que la réponse fournie est incorrecte. – Gausie

+0

merci pour votre commentaire Gausie :) – Sarfraz

13

ajouter ce CSS:

ul { 
    list-style-position: outside; 
} 

Exemple ici: http://jsbin.com/emeda/

+0

Cela devrait lire la liste-style-position –

+0

@ Jean-François Beauchamp merci, vous avez raison. Vous pouvez les éditer vous-même, vous savez. :) – nickf

1

Pour ma liste ordonnée et la retrait de ligne multi J'ai suivi ci-dessous css

.surveyorderedlist{ 
     ol{ 
      list-style-position: outside; 
     } 
     li{ 
      margin-bottom:5px; 
      margin-left:40px; 
      padding-left:8px; 
     } 
    } 

puis votre code html doit être

<div class="surveyorderedlist"> 
      <span><b>Conditions imposed</b></span> 
      <ol> 
       <li>Names and addresses are accessed only by the Financial Service Provider on its own behalf, and solely for its own use;</li> 
       <li>Names and addresses may only be accessed for a specified purpose;</li> 
       <li>The fees charged for the provision of the names and addresses from the Motor Vehicle Register (MVR) are duly paid;</li> 
       <li>Any instances of unauthorised access must immediately be notified to the Secretary for Transport and the Privacy Commissioner; </li> 
      </ol> 
</div>