Geek Answers Handbook

Check box and drop down arrows are invisible in chrome

For some reason, my checkboxes and drop-down arrows do not appear in chrome, however they still work.

They are perfectly visible in IE. When I load a page in IE, try loading the page in chrome, they usually appear until I refresh the page again in chrome.

Does anyone know what the problem is?

Reference Image: http://i.imgur.com/Q66w6.png

+4
source share
6 answers

The "solution" to this Chrome problem is to

  • open task manager
  • refresh the page in Chrome while the Taks Manager is open in front of the browser.

I could not believe that it would really work when I read about it, but I saw it with my own eyes. This issue seems to exist from earlier versions of Chrome and still exists in current versions, although this only happens occasionally. It seems that it finally disappeared after this “correction”.

+5
source

I was rewriting webkit defaults to prevent chrome from taking my style.

A brilliant side effect is removing the drop-down arrow. Awsome.

This css line was causing my problem.

select{ -webkit-appearance:none; }
+2
source

Found this question having the same problem.

Installation:

 input { width:100% }

was the cause of this problem for me. It:

 input[text] { width:100% }

was what I wanted (leave the flag width unchanged) - setting the width of the flags in chrome seems to make them disappear.

0
source

As mentioned by user48956; setting the input width to 100% leads to the disappearance of flags in chrome.

I use bootstrap and often have forms where I want all inputs to stretch 100% and do not want to use bootstrap form methods , and this problem still arises.

If you define input {width:100%} , you can put the width in the div containing this flag and it will be fixed. eg.

 <div style="display:inline-block; width:20px"><input type="checkbox" name="read_privacy_policy" id="read_privacy_policy" class="pull-left"></div> <div style="display:inline-block">I have read and understand the Privacy Policy.*</div>

or you can set style="width:auto" to the input itself

0
source

I had the same problem

Try using this css style for styles that acts on the input checkbox element.

 -webkit-appearance: checkbox!important;
0
source

I think this is a mistake and it is still there. I am using checkboxes in ligthbox window and they are not showing. I work on OS-X using Chrome 21.

-2
source

More articles:


All Articles