How to disable mask on selected image in the f/ckeditor in webkit, opera browsers?

Tags: css,ckeditor,fckeditor

Problem :

When one selects an image in the fckeditor or ckeditor in webkit browsers ( chrome, safari ) and others like opera, the image is overlaid with a transparent gray mat, presumably as a visual cue to the user that the image is selected ( reference attached images ). The problem is this makes it impossible to apply any css effects to the image efficiently within the editor. This seems to be a browser default user agent style issue, as firefox actually works as desired. How can one target, override and disable this?

Annoying mask on image selection in editors on webkit / opera browsers

Preferred image selection without mask in editor on firefox / IE browsers

Solution :

Alright, looks like the answer to this is just a matter of styling ::selection afterall.

    CSS Howto..

    how to set overflow: hidden; to one element

    How can I make one item with its own class a different colour from others?

    How to use ­ and the CSS “hyphens” property together?

    How to print outlines and background colors from css, when using JQuery printElement, and IE8?

    How to create a pure CSS tooltip with HTML content for inline elements

    How do I use pseudo-selectors to change a “Home” button to an icon using just CSS?

    How can I prevent this plugin from popping up from behind the content area?

    How to vertically align numbers of ol?

    How to change the background colour's opacity in CSS [duplicate]

    Keep mobile browser from showing elements outside body?

    CSS Transitions using AngularJS ng-show

    How can I apply CSS only to digits in jQuery?

    How do I edit the VIM Omni Completion so that all CSS properties do not end in a colon?

    How to create a fluidic list using css

    How to embed a font in website

    how to dynamically append tr element with css to a table

    How can I display links in 2 rows?

    How to retrieve sibling content in jquery?

    how to make a span hold its position from an encroaching div

    CSS\HTML - How to add Ionicons to CSS “content” property?

    How to make a text or html tag look like a button

    How to divide a border into 4 equal parts?

    How to center the buttons and make them same size

    How to add space between border line and menu item

    How to vertically center text overlapping an image?

    How can I produce an nested list in XHTML strict without giving the nested lists first element a double bullet?

    Hiding and showing
    • on click using Javascript

    How to add a css class to jquery selectable

    CSS: position: absolute together with margin: auto for centering - How does that work?

    CSS - How to move an absolutely positioned item relatively to its current position