Limite de largeur de texte, avec wraps

Dans une application de rails, je construis une application en utilisant les flux, je modifie la mise en page d'une page, la limite de texte des flux est de 140 caractères et la fenêtre qui contient le le texte a une largeur de 63em. Si le texte est assez long (50/60 caractères) il va étaler la fenêtre, je veux qu'après un certain nombre n de caractères le texte va s'enrouler et continuer dans une autre ligne, par exemple si ce nombre n est 6 et i insérer le texteLimite de largeur de texte, avec wraps

hi my name is davide

quand il a donné en sortie il est devenu

hi my na 
me is davide

si vous savez même comment inclure des espaces et comment ne pas casser les mots (nom -> na moi) , dis-moi, ce serait mieux.

est ici le code qui donne les flux en sortie

<body align="center"> 
    <div class="dialog"> 
     <h1>La Grande Guerra</h1> 
    </div> 

    <p> 
     <%= link_to 'Nuovo Feed', new_feed_path %> 
    </p> 

    <% @feeds.each do |feed| %> 
     <p> 
      <b>Data di pubblicazione: </b><%= feed.date %><br><br> 
      <b>Feed:</b><br><br> 
      <%= feed.feed_text %><br><br> 
      <%= link_to 'Mostra', feed %> 
      <%= link_to 'Modifica', edit_feed_path(feed) %> 
      <%= link_to 'Elimina', feed, method: :delete, data: { confirm: 'Are you sure?' } %> 
      <a href="http://localhost:3000">Torna all'inizio<br></a> 
     </p> 
    <% end %> 

    <br> 

    </body>

et voilà comment je crée les "fenêtres" (j'ai pris ce code de l'erreur page 404)

div.dialog 
    { 
     width: 55em; 
     margin: 4em auto 0 auto; 
     border: 1px solid #CCC; 
     border-right-color: #999; 
     border-left-color: #999; 
     border-bottom-color: #BBB; 
     border-top: #B00100 solid 4px; 
     border-top-left-radius: 9px; 
     border-top-right-radius: 9px; 
     background-color: white; 
     padding: 7px 4em 0 4em; 

    } 

    body > p 
    { 
     width: 63em; 
     margin: 0 auto 1em; 
     padding: 1em 0; 
     background-color: #F7F7F7; 
     border: 1px solid #CCC; 
     border-right-color: #999; 
     border-bottom-color: #999; 
     border-bottom-left-radius: 4px; 
     border-bottom-right-radius: 4px; 
     border-top-color: #DADADA; 
     color: #666; 
     box-shadow:0 3px 8px rgba(50, 50, 50, 0.17); 
     color:black; 
    }

Source

2014-07-07 user3764449

Je pense que le plus proche, vous pouvez venir avec pure css utilise 'word-wrap: break-word', mais cela impliquerait de remplacer tous sp aces avec des espaces non cassants (' ') - http://jsfiddle.net/Y3M8z/, sinon votre meilleur pari serait d'utiliser javascript et d'insérer un 'br' tous les six caractères – Pete

Try This

body > p 
     { 
      width: 63em; 
      margin: 0 auto 1em; 
      padding: 1em 0; 
      background-color: #F7F7F7; 
      border: 1px solid #CCC; 
      border-right-color: #999; 
      border-bottom-color: #999; 
      border-bottom-left-radius: 4px; 
      border-bottom-right-radius: 4px; 
      border-top-color: #DADADA; 
      color: #666; 
      box-shadow:0 3px 8px rgba(50, 50, 50, 0.17); 
      color:black; 

-ms-word-break: break-all; 
    word-break: break-all; 

    // Non standard for webkit 
    word-break: break-word; 

-webkit-hyphens: auto; 
    -moz-hyphens: auto; 
     hyphens: auto; 
     }

Source

2014-07-07 14:11:31 Suresh

Limite de largeur de texte, avec wraps

Répondre

Questions connexes