Selecting form element

Selecting form element
0

#1

Can we change the color appeared whenever your are selecting an element on form?

Here’s my codepen. https://codepen.io/zhouxiang19910319/pen/xzeVro?editors=1100

I want to customize the color showed whenever you are selecting something. For example this:


#2

For some reason your uploaded screenshot is showing blank.


#3

it is supposed to be blank… could you see the light blue selection color there? thats what I wanna customize…


#4

Read about the focus pseudo-class, which should allow you to do what you want.


#5

You should look for input, textarea, etc border-color on :focus state


#7

Since you already have a form-control focus selector, you could simply use the border property and specify a width, border style, and color.


#8

Thanks, I did it.

.form-control:focus{
  box-shadow: none;
  border: 1px solid #23B6C7;
}

#9

Out of curiosity, since the border you chose is just a little narrower than the border that would have been on it if you would not have specified box-shadow: none; for the same selector, did you just not like the wider border?


#10

yeah… I dont really like the default box-shadow


#11

Yeah you could take it out by also selecting the outline and styling it