CSS select input by class

Question

I've tried to find some way to select all form inputs by class.

<form action="" class="registerForm">
   <input type="text" name="loginInput" class="registerInputField">
   <input type="email" name="emailInput" class="registerInputField">
   <input type="password" name="passwordInput" class="registerInputField">
   <input type="password" name="confirmPasswordInput" class="registerInputField">
   <input type="submit" value="Register">
   <input type="submit" value="Cancel">
</form>

I've tried: `

input.registerInputField{}
.registerForm > input[type=text]{}
input[type=text].registerInputField{}

I read a few topics related to this, but it didn't work. I'll be glad for showing me some source or a book where I can find the answer.

HTMLElement.getElementsByTagName('input')

Adrian Solarczyk
– Adrian Solarczyk

2020-04-01 18:28:06 +00:00
Commented Apr 1, 2020 at 18:28 — Adrian Solarczyk
– Adrian Solarczyk, Commented Apr 1, 2020 at 18:28
@AdrianSolarczyk: You're not wrong, but that's JavaScript.

Devin Burke
– Devin Burke

2020-04-01 18:30:52 +00:00
Commented Apr 1, 2020 at 18:30 — Devin Burke
– Devin Burke, Commented Apr 1, 2020 at 18:30

Devin Burke · Accepted Answer · 2020-04-01 18:28:26Z

2

Every one of the examples you gave work. Without more context, such as whether you're using Angular which adds in scoping that might be relevant, it's impossible to say why you might experience it not working. But this clearly works:

input.registerInputField {
   background-color: purple;
}

<form action="" class="registerForm">
   <input type="text" name="loginInput" class="registerInputField">
   <input type="email" name="emailInput" class="registerInputField">
   <input type="password" name="passwordInput" class="registerInputField">
   <input type="password" name="confirmPasswordInput" class="registerInputField">
   <input type="submit" value="Register">
   <input type="submit" value="Cancel">
</form>

answered Apr 1, 2020 at 18:28

Devin Burke

13.8k12 gold badges60 silver badges85 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Wojtek TQ Over a year ago

Thank you for help!

user13152960 Over a year ago

@Devin Burke Great

Collectives™ on Stack Overflow

CSS select input by class

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related