I’m using twitter-bootstrap grid system and you can see the problem right here.
The text which is supposed to be in the center keeps outgoing from the center to right side as you can see…
<div class="row mt-2">
<div class="col-3"></div>
<div class="col-6">
<div class="text-left">
<p class="d-0">
<span id="issuer_msg" style="white-space: pre-line">{{msg.message}}</span>
<br>
</p>
<div class="text-center">
<small class="text-primary font-weight-normal">{{msg.sent_time}}</small>
</div>
</div>
</div>
</div>
How can I fix the problem?
2
Answers
I think the problem is coming from your small tags. Wrap paragraph around it.
The problem is from your inline styles where you used "white-space:pre-line"
Try using "white-space:pre-wrap" instead