[Alert] html content breaks up text in Alert
See original GitHub issue- The issue is present in the latest release.
- I have searched the issues of this repository and believe that this is not a duplicate.
Current Behavior 😯
The content in the Alert component breaks into several lines when html tags are present in the content. For example: <em>
, <i>
, <strong>
Expected Behavior 🤔
The presence of html content should not cause line breaks. Specifically when using html tags aimed at formatting text.
Steps to Reproduce 🕹
import Alert from '@material-ui/lab/Alert'
<Alert severity="warning" icon={false}>You are going to transfer ownership of <strong>Demo Team</strong> to another user, and you will be given Administrator access.</Alert>
Demo: https://codesandbox.io/s/funny-sun-kxmym
Tech | Version |
---|---|
Material-UI | v4.9.5 |
Material-UI Lab | v4.0.0-alpha.45 |
React | 16.8 |
Browser | Chrome v80 |
Issue Analytics
- State:
- Created 4 years ago
- Reactions:1
- Comments:9 (8 by maintainers)
Top Results From Across the Web
[Alert] html content breaks up text in Alert #20023 - GitHub
The presence of html content should not cause line breaks. Specifically when using html tags aimed at formatting text. Steps to Reproduce.
Read more >New line in JavaScript alert box - Stack Overflow
I saw some people had trouble with this in MVC, so... a simple way to pass '\n' using the Model, and in my...
Read more >How to Line Breaks to JavaScript Alert? - Tutorialspoint
To add line breaks to JavaScript alert, use “\r ”. In the following example, we will see how to display text in JavaScript...
Read more >Removing Extra Line Breaks in HTML alerts - Forum
I was able to make it work by removing all whitespace from the code.. works, but not easy to edit later.. <html><head><style type="text...
Read more >How to add a new line in the alert box ? - GeeksforGeeks
To add a new line to the content of alert box we are going to use \n backslash(n). Example-1: This example adds \n...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@developerKumar Feel free to go ahead.
Is this up for PR?