I have a weird problem with IE11(works in chrome and edge), in certain situations the background-color hides the text above it, trying to find out an update to IE11 to fix it, if exists(company computers, due to certain limitations cant use enterprise mode and cant update all users to win10, also can't fix the html since its generated from outlook outside the company) here is the most simplified version
<p style="direction: rtl;">
<span dir="LTR" style="color: black; background-color: yellow;">Why Am I Yellow</span>
</p>
If anyone can help find a fix, or maybe even an IE11 version where it works it will be appreciated.
How to Add Background Color in HTML. To add background color in HTML, use the CSS background-color property. Set it to the color name or code you want and place it inside a style attribute. Then add this style attribute to an HTML element, like a table, heading, div, or span tag.
Click on "Appearance and Personalization" and select "Personalization." Click on "Window Color and Appearance." Click directly on the color you want displayed in your toolbar.
Making the span inline-block
seems to fix the issue on my IE11 (version 11.0.9600.19267)
<p style="direction: rtl;">
<span dir="LTR" style="color: black; background-color: yellow; display: inline-block;">Why Am I Yellow</span>
</p>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With