Baidu editor ueditor foreground code highlighting cannot automatically wrap
In the past two days, the website has successfully installed and integrated the Baidu editor ueditor, which is quite good, but has encountered some minor problems.
Problem description:
Insert the code highlighted in the content. The background editor can automatically wrap the text. However, after the text is published, you can view it on the foreground and find that the Code cannot wrap automatically, which is beyond the boundaries of the Content Page, not beautiful, although the replication can be complete.
Solution:
Find the css file/e/data/ecmseditor/ueditor/third-party/SyntaxHighlighter/shCoreDefault.css displayed in the highlighted code.
The specific path is modified according to your ueditor.
Find
The Code is as follows:
. Syntaxhighlighter {width: 100%! Important; margin:. 3em 0. 3em 0! Important; position: relative! Important; overflow: auto! Important; background-color: # f5f5f5! Important; border: 1px solid # ccc! Important;
Change
The Code is as follows:
. Syntaxhighlighter {width: 100%! Important; margin:. 3em 0. 3em 0! Important; position: relative! Important; overflow: auto! Important; background-color: # f5f5f5! Important; border: 1px solid # ccc! Important; word-break: break-all;
Add word-break: break-all;
Different ueditor versions may have different css statements, as long as the corresponding position is added with this forced line feed.