I am currently working on developing ASP.NET MVC applications. However, I am facing a design issue with the HTML, CSS, and Bootstrap elements on one of my pages.
The problem arises when Question 8 exceeds the border and does not wrap to a new line as intended.
Is there a way to ensure that the question text breaks onto a new line when it becomes too long?
Specifically, the challenge lies in preventing the question text from extending beyond the right border and forcing it to start a new line before reaching that point.
I have attempted to address this by using the following code snippet:
<div style="margin-top:5px;">
<label class="requestInfo-lable-1"
style="font-size: 11px; width: 50px; overflow-wrap: break-word; display: flex;">
@Html.Label("Question8", htmlAttributes: new { @class = "control-label col-md-5" })
</label>
</div>
For more context, below you can find detailed scripts related to CSS and the structure of the HTML page:
CSS Script:
(CSS script details provided here)HTML Page Structure:
(HTML structure details provided here)In addition, you can view an image displaying the issue where the text exceeds the border via this link: Example Image Link