Can't add css to switch in html

Question

I'm using label And class of switch but can't add css property to check box so that i can create switch even span in not working.

.switch {
  position: relative;
  display: inline - block;
  width: 60 px;
  height: 34 px;
  background: #999
}

<label class="switch"><input type="checkbox"><span class="slider round"></span></label>

I think your looking for this https://codepen.io/AllThingsSmitty/pen/MmxxOz — Mark Gerryl Mirandilla, Oct 03 '18 at 07:11
Can you add a more detailed explanation of **what do you want to achieve, what is the problem you're facing and how can we help you** ? — vrintle, Oct 03 '18 at 07:17

score 0 · Answer 1 · answered Oct 03 '18 at 07:15

The question is unclear, but as far as I understood, you are trying to give some styles to your elements, and it seems that your style doesn't apply on your checkbox.

Anyways, your style is working fine, I've just added a background property to show you that your styles have been applied without any problems.

.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
  background: #999
}

<label class="switch">
  <input type="checkbox">
  <span class="slider round">foo</span>
 </label>

If you are trying to give custom styles to your checkbox, read the answers to this question

Welcome to the StackOverflow community, and the more specific your question can be, you will get better, to the point answers... Good Luck!

score 0 · Answer 2 · answered Oct 03 '18 at 07:31

0

css is identifying input like below

input[type='checkbox']:checked{
   //if checked then property
}

answered Oct 03 '18 at 07:31

raviramani

522
2
14

score 0 · Accepted Answer · answered Oct 03 '18 at 07:32

0

.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
  background: #000000;
  }

<label class="switch"><input type="checkbox"><span class="slider round"></span></label>

Please check above code I have tried that it's working

answered Oct 03 '18 at 07:32

Arshiya Khanam

613
6
12

2

Am I the only one who wonders how this is the right answer, since it doesn't change anything from the original. – Mr Lister Oct 03 '18 at 09:29

Can't add css to switch in html

3 Answers3