Christopher Jakob
Christopher Jakob

Reputation: 89

text inside bootstrap div is not respecting div bounds using angular 8

<div class="container-fluid mt-5">
  <div class="row">
    <div class="col-2 boarder">
      fjkdfjklsddfsfdkjdfskjldfskljdfdsfjkldfsdfsf
    </div>
    <div class="col-9">
      whatever
    </div>
  </div>
</div>

css file

.boarder{
  border: solid 1px blueviolet;
}

there is the html code

Here is proof the bootstrap was installed correctly:

"styles": [
              "./node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css",
              "src/styles.scss",
              "node_modules/bootstrap/dist/css/bootstrap.min.css",
              "node_modules/font-awesome/css/font-awesome.css"
              ],

Here is what the damn thing looks like

what the thing looks like

why for this? You know why for this? Please explain why for this!

Upvotes: 0

Views: 39

Answers (1)

Abhishek Pakhare
Abhishek Pakhare

Reputation: 494

Use word-break: break-all; it will break the long words. Note

Upvotes: 1

Related Questions