8

I want to change the blue glow if the focus on Bootstrap 3 input and textareas.

I tried adding this 

textarea:focus, input:focus, input[type]:focus, .uneditable-input:focus {   
    border-color: rgba(229, 103, 23, 0.8);
    box-shadow: 0 1px 1px rgba(229, 103, 23, 0.075) inset, 0 0 8px rgba(229, 103, 23, 0.6);
    outline: 0 none;
}

to my costum.css but it only change the glow of input fields, not textarea. I also tried this, 

.input:focus {
    outline: none !important;
    border:1px solid red;
    box-shadow: 0 0 10px #719ECE;
}

which changed nothing.

I am not a CSS savvy so appreciate your help.

Community
  • 1
  • 1
supermario
  • 2,625
  • 4
  • 38
  • 58

1 Answers1

18

Try using:

textarea:focus, input:focus, .uneditable-input:focus {   
    border-color: rgba(229, 103, 23, 0.8) !important;
    box-shadow: 0 1px 1px rgba(229, 103, 23, 0.075) inset, 0 0 8px rgba(229, 103, 23, 0.6) !important;
    outline: 0 none !important;
}
Ian Hazzard
  • 7,661
  • 7
  • 34
  • 60
  • Excellent. God bless you :) Just curious: Is there any benefit of using rgba() instead of 6digit color codes starting with #? – supermario Feb 18 '15 at 01:44
  • 2
    Use rgba() if you want some transparent color values. Read about RGBA here: http://www.w3schools.com/cssref/css_colors_legal.asp, and here: http://www.w3schools.com/cssref/tryit.asp?filename=trycss_color_rgba – Ian Hazzard Feb 18 '15 at 01:48