Not sure about the exact rules governing this, but usually when the colors of a text being selected are "inverted" the selection colors (background/foreground) get inverted too, as in (see sample attached):

<p>
...</p>

<p style="background: Highlight; color: HighlightText;">
...</p>

<p style="background: white; color: black;">
...</p>

<p style="background: black; color: white;">
...</p>

I find Mozilla's behavior of choosing whether to use inverted selection colors suboptimal compared to other browsers, like Opera 10.60 and Safari 5, IE 6 (I'm trying this on Windows XP), for example. Going to <http://blog.mozilla.com/about_mozilla>:

http://imgur.com/gaQxm.png

Then selecting some of the text I hardly see the selection:

http://imgur.com/2I7CK.png

It appears o.k. in Opera:

http://imgur.com/MMERV.png

Looking into it I see:

  <body>
    <div id="rap">
      <div id="top">
        ...

And the following CSS rules applied:

body {
  background: #333 url(img/bodybg.png) repeat-x fixed top center;
}
#top {
  background: url(img/contentbg.gif) repeat-y top center;
}

Removing the background image (using Firebug, DOM Inspector, a bookmarklet) from the div#top makes this clearer:

http://imgur.com/b32u2.png
http://imgur.com/V6ODK.png

Seems Mozilla is picking the selection colors based on the guessed background color which doesn't seem as reliable (background images could not easily be taken into account). I think Mozilla should just be using the color of the text when determining the selection colors, as the other browsers appear to do.

My Bugzilla search revealed couple releated, but not same issues on Linux and Mac platforms:

(Linux) selection highlights not visible in "inverse" high-contrast themes <https://bugzilla.mozilla.org/show_bug.cgi?id=237534>

(Mac) Selected text highlight color does not contrast with foreground or background color <https://bugzilla.mozilla.org/show_bug.cgi?id=445258>

Is anyone aware of this filled before, at least on Windows?

--
Stanimir
Title: Selection Colors Test

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam sollicitudin pellentesque faucibus. Duis consectetur gravida turpis sit amet semper. In quis orci in sapien auctor accumsan viverra nec lacus.

Aliquam quam risus, lacinia at fermentum ac, molestie rhoncus felis. Nam eu enim vel sem hendrerit mollis vitae viverra massa. Curabitur lorem neque, ultrices vitae fermentum eget, placerat id libero.

Integer vel libero non lorem fermentum elementum quis in leo. Quisque tincidunt accumsan eleifend. Vestibulum in quam nibh, id bibendum leo.

Nullam metus magna, tempus at sodales ut, gravida a metus. In vitae justo sed eros auctor viverra. Aliquam tempor est eu tellus aliquet ullamcorper. Nunc volutpat viverra elit in varius. Aenean sed nisl velit.

_______________________________________________
dev-tech-layout mailing list
[email protected]
https://lists.mozilla.org/listinfo/dev-tech-layout

Reply via email to