14

This is the textarea

http://i.imgur.com/kdugksf.png

This is the textarea that is clicked on and has text in it

http://i.imgur.com/jKo4WrG.png

When Google chrome's autocomplete hijacks the textarea

http://i.imgur.com/Ex8fYyu.png

I've tried fixing it by putting in this code

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #FFFFFF inset;
}

But the best I can get it to look like is this

http://i.imgur.com/XyPNLZz.png

I want the white box to either be transparent, or it can stay white but be smaller so that it does not block any of the blue parts of the textbox. Is this possible at all? I've tried googling around and I came up with nothing. Or if you guys have any other ideas on how to fix this, that would be great!

Also, if there is a way to make the autocomplete box just a little bit smaller that would be fine too, or maybe a way to move the label down ? =/

I want autocomplete on.

14
  • did you try backgound-color:rgba(0,0,0,0) for the autocomplete?
    – j_s_stack
    Jan 29, 2015 at 0:26
  • Can you provide a code snippet?
    – imtheman
    Jan 29, 2015 at 0:26
  • @j_s_stack OP of course.
    – imtheman
    Jan 29, 2015 at 0:28
  • or background:transparent;
    – www139
    Jan 29, 2015 at 3:04
  • @imtheman I'm not sure what you want a code snippet of?
    – DanMossa
    Jan 29, 2015 at 6:42

3 Answers 3

-1
+50

try this: background-color: #fff !important;

http://labs.enonic.com/articles/remove-forced-yellow-input-background-in-chrome

Removing input background colour for Chrome autocomplete?

Are you sure I found this: Google Chrome form autofill and its yellow background

7
-3

Please try this:

input:-webkit-autofill {
    -webkit-box-shadow:5px 5px 5px rgba(0,0,0,0.3);
}

rgba fourth argument is opacity level.

1
  • Goes to the default yellow autocomplete
    – DanMossa
    Jan 30, 2015 at 4:59
-3

also try:

input:-webkit-autofill {
   background:rgba(255,255,255,0) !important;
}

Not the answer you're looking for? Browse other questions tagged or ask your own question.