Pens from Scheibo https://codepen.io/scheibo/ en nospam@codepen.io Copyright 2024 2024-02-01T13:19:33-07:00 splidejs - Slider cards https://codepen.io/scheibo/pen/QWYRzMq https://codepen.io/scheibo/pen/QWYRzMq Scheibo

See the Code - See it Full Page - See Details

]]>
splidejs - Slider cards 2024-02-01T13:19:33-07:00
Debugging Container Queries with CSS resize ✨ https://codepen.io/scheibo/pen/OJaddRy https://codepen.io/scheibo/pen/OJaddRy Scheibo

See the Code - See it Full Page - See Details

]]>
Debugging Container Queries with CSS resize ✨ 2023-08-03T12:07:50-07:00
SVG Mask https://codepen.io/scheibo/pen/GRXgzMp https://codepen.io/scheibo/pen/GRXgzMp Scheibo

See the Code - See it Full Page - See Details

]]>
SVG Mask 2023-02-16T13:04:03-07:00
Responsive Organization Chart [updated] https://codepen.io/scheibo/pen/mdKMZQB https://codepen.io/scheibo/pen/mdKMZQB Scheibo

See the Code - See it Full Page - See Details

A pure HTML/ CSS responsive organization chart with departments and sub-sections Improvements: - media queries are separated in one place only and not all over the css (more control on it) - 3 new style of line (a 3 block column line; a 2 block column block line; a single block line) - use SCSS to maange easly varaibles and breakepoint - separated the list of departments from board area (more control and less ul insie ul inside ul inside ul) - 7 column on the department area inspired from [Ronny Siikaluoma](http://codepen.io/siiron/)'s Pen [Responsive Organization Chart](http://codepen.io/siiron/pen/aLkdE/).

]]>
Responsive Organization Chart [updated] 2022-11-16T10:59:06-07:00
CSS Clamp - Headline https://codepen.io/scheibo/pen/NWaVeRV https://codepen.io/scheibo/pen/NWaVeRV Scheibo

See the Code - See it Full Page - See Details

]]>
CSS Clamp - Headline 2022-01-20T08:10:09-07:00
HTML text inside a circle shape https://codepen.io/scheibo/pen/zYEMzdW https://codepen.io/scheibo/pen/zYEMzdW Scheibo

See the Code - See it Full Page - See Details

]]>
HTML text inside a circle shape 2022-01-12T10:58:43-07:00
Custom Accessible Radio Buttons: Pseudo Element as Check https://codepen.io/scheibo/pen/PoJwQEb https://codepen.io/scheibo/pen/PoJwQEb Scheibo

See the Code - See it Full Page - See Details

Taken from [How to Make Custom Accessible Checkboxes and Radio Buttons](http://webdesign.tutsplus.com/tutorials/how-to-make-custom-accessible-checkboxes-and-radio-buttons--cms-32074) by Sami Keijonen

]]>
Custom Accessible Radio Buttons: Pseudo Element as Check 2021-12-01T13:12:48-07:00
Links styles - internal , subpage and external https://codepen.io/scheibo/pen/WNOqJEr https://codepen.io/scheibo/pen/WNOqJEr Scheibo

See the Code - See it Full Page - See Details

]]>
Links styles - internal , subpage and external 2021-10-05T15:43:06-07:00
Select description https://codepen.io/scheibo/pen/xxqQWXV https://codepen.io/scheibo/pen/xxqQWXV Scheibo

See the Code - See it Full Page - See Details

Credits: https://twitter.com/calebporzio/status/1400440495743057926

]]>
Select description 2021-06-14T06:11:38-07:00
Automated Accessible Color Contrast Ratios (with Lookup Table) https://codepen.io/scheibo/pen/mdWKMRE https://codepen.io/scheibo/pen/mdWKMRE Scheibo

See the Code - See it Full Page - See Details

]]>
Automated Accessible Color Contrast Ratios (with Lookup Table) 2021-06-09T10:12:04-07:00