I just have one question though. If you place the <input type="checkbox" /> besides <div className="switch-ui"></div> would it still maintain it's width and height causing a weird spacing between the label and the <div className="switch-ui"></div>?
Hmmmm, This is probably the reason why I use display: none;. hahaha
I didn't describe the technique too well. I've been intending to do a toggle control in my Web Component experiments. If you like, share one this weekend so you can see what I mean.
Something I want to make sure I am getting across is that you're doing great work! I don't want to give the impression I'm saying "This is the way to do it" -- I'm absolutely not. This is just how I do things and you might see a useful technique or two. I guess I spend too much of my time teaching my devs; Hard habit to break ;-)
Hey @Jer, Thanks for this great advice.
I just have one question though. If you place the
<input type="checkbox" />besides<div className="switch-ui"></div>would it still maintain it's width and height causing a weird spacing between the label and the<div className="switch-ui"></div>?Hmmmm, This is probably the reason why I use
display: none;. hahahaI didn't describe the technique too well. I've been intending to do a toggle control in my Web Component experiments. If you like, share one this weekend so you can see what I mean.
Something I want to make sure I am getting across is that you're doing great work! I don't want to give the impression I'm saying "This is the way to do it" -- I'm absolutely not. This is just how I do things and you might see a useful technique or two. I guess I spend too much of my time teaching my devs; Hard habit to break ;-)
Hopefully this does a better job of explaining what I meant. :)
codepen.io/aut0poietic/pen/EqaGgw