Rego’s Everyday Life

A blog about my work at Igalia.

This has been in the oven for quite a while, nice to see it being enabled by default. Looks small but the implementation details are quite tricky. Hope to see it landed in other browsers. Great work by Delan and Stephen as part of Igalia collaboration with Bloomberg.

<style>
.info { color: white; background: blue; }
.info::selection { color: black; background: cyan; }
</style>
<div class="info">
<strong>INFO</strong> - This is just an <em>informative</em> message.
</div>

Screenshot of the HTML & CSS example from the previous image, before and now that the new inheritance model is enabled. Before, when you selects the text, you get a white text and blue background in "INFO" and "informative", while the rest has a white text and cyan background. Now, when you selects the text, everything is white text and cyan background.

See: https://developer.chrome.com/blog/selection-styling