Grid Columns data overlapping in semantic-ui-react

问题:

https://codesandbox.io/s/m3ljr4zl8p

example.js

I wasn't expecting column1 data to start overlapping into column2's instead of going down as it is now exceeding the grid column width.

What is the solution for this?

回答1:

Columns are not overlapping. It's your <p> element takes more space than columns.

Add this style to it:

word-break: break-word;

Before word-break:

After word-break: