This is the eighteenth post in a series examining modern CSS solutions to problems I've been solving over the last 13+ years of being a frontend d...
For further actions, you may consider blocking this person and/or reporting abuse
Notice that with the default printing settings, backgrounds are removed. If a user prints a page with these radio buttons, they won't be able to know which one was checked. (Inset) Box-shadows are not removed at printing, and they will a similar effect to the radial background.
Good tip, it's easy to forget about the scenario of a page being printed!
Updated with an alternate option that swaps to use of
box-shadow
- thanks again!It would be nice to see the upcoming 'lh' and 'rlh' CSS length values. That way the radio's height and width can be set to
1lh
which will align it properly. Look at this blog post regarding the soon-to-be unit.Great thought, I look forward to updating the recommendation in this post when that has better support! You could certainly define it following the
em
definition to prepare for it being available 👍Yeah...definitely a future idea.
Just to clarify, you're using SCSS not pure CSS here right? I noticed the nested selectors and was kinda confused for a moment there... hehe
Ah, you got me on a technicality - that's correct. I need to remember to add a note 😉 But it's not using any special features of Sass so it's still true, ha!
Great Tips! I wanted to ask if you have planned to make an article also on the different input types. I'm struggling with input color and such a good explanation would be helpful 😊
Thanks! Yes, I will also be covering the other varieties of
input
andtextarea
as well asselect
Ok awesome :)
very interesting post thanks for this! :)
This rules. Thanks Stephanie
🙌