Wrap Text mit Pre-Wrap funktioniert nicht

Question

Ich habe diesen Code:

<div class="well details-form"> 
<div class="row"> 
     <div class="col-md-6">Test:</div> 
     <div class="col-md-6" style="white-space: pre-wrap">mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm</div> 
    </div> 

</div> 

Ich versuche, die div zu erhalten, die den Langtext enthält zu wickeln. Das ist nur ein Test, aber die Länge könnte die gleiche sein, daher die Notwendigkeit für die Verpackung.

Wie bekomme ich das zu wickeln?

Hier ist ein Bootply.

Jede Hilfe wird geschätzt.

Answer 1

Verwenden Sie word-break: break-all anstelle von white-space: pre-wrap.

mehr an MDN lesen: https://developer.mozilla.org/en-US/docs/Web/CSS/word-break

.details-form { 
 
    width: 70%; 
 
    margin: auto; 
 
}

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> 
 

 
<div class="well details-form"> 
 
    <div class="row"> 
 
    <div class="col-md-6">Test:</div> 
 
    <div class="col-md-6" style=" 
 
    word-break: break-all; 
 
">mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm</div> 
 
    </div> 
 
</div> 
 

 
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
 
<script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

Answer 2

Der Stil style="white-space: pre-wrap" funktioniert nur dann, wenn ein Raum, in dem Text angetroffen gibt.