How can I make use of `::selection` for <input> in chrome browsers?

Question

I am trying to set a background and color for Input values. I succeeded doing that ::-moz-selection for Mozilla browsers, but ::selection in Chrome and other browsers like Opera doesn't work.

Screenshot of the form in Chrome- ::selection. It fails:

Screenshot of the form in Mozilla Firefox- ::-moz-selection. It works:

Here is my code:

<form>
First name: <input type="text" name="FirstName" value="John"><br>
Last name: <input type="text" name="LastName" value="Doe"><br>
<input type="submit" value="Submit">
</form>

<p>Your first and last name, please!!!.</p>

And the CSS:

::selection
{
color: #fff;
background: green;
}
::-moz-selection
{
color: #fff;
background: green;
}
input::selection
{
color: #fff;
background: purple;
}
input::-moz-selection
{
color: #fff;
background: purple;
}

Could any one tell me how to make that work with Chrome and other browsers? Created a fiddle with the entire code here.

Update: I would like to clear myself that the question is about adding ::selection for the text inside <input> and other form fields(explained in the question at first place). The question is not about ::selection for normal text in browsers other than Firefox(works fine in Firefox). I never had problems adding ::selection for non-form elements in any browser.

Answer 1

I think they started supporting this selector.

::selection selector to give a color for the text inside <input> works fine on Chrome browser now. You can check the same snippet on chrome to test.