Submissions
Article No Longer Available
What is this
I'm starting a new series aimed at helping yo...
For further actions, you may consider blocking this person and/or reporting abuse
Cool challenge!
Here's my take: codepen.io/kyle-o/pen/vYYEbdq
Some considerations I made:
aria-*
attributes for accessibility.em
sizing for elements inside the.breadcrumbs
class, and clip-path instead of the CSS triangles technique so that the component is able to scale simply by changing the font size of the.breadcrumbs
class. This way, in the context of a larger app, we can easily usefont-size
utility classes and everything scales nicely without breaking.@supports
to modify the spacing between breadcrumbs in non-supported browsers.)Here you go codepen.io/pclaisse/pen/KKKwBKZ
Looks awesome, it's about the same as what I did, except I haven't used scss before.
Hi All,
Nice to join the challenges.
I guess it's not to late to join.
Here's my submission for 'Breadcrumbs'.
codepen.io/skay/full/bGGeraq
Used simple CSS selectors and properties.
Hi all!
My example: codepen.io/bryant---24/pen/qBBEyjB
In my example, I used 'span' tag, as I think, since it will be semantically correct.
Oh, I'm interested in your reasoning for using
span
instead ofa
.Also if it doesn't bother you I've created a separate post for discussing this topic, so if you could pitch in there it'd be appreciated:
Breadcrumbs - Semantics and Accessibility
Milan Radojević ・ Oct 8 ・ 1 min read
Also I see you're using BEM as well 😀. How long have you been doing it and what your experience with it like?
Hi @Milan!
Thank you for your answer. :-)
I use BEM for a long time, it helps a lot on large projects in our team.
Something very very simple:
codepen.io/Scario/pen/gOObjdG
If you want to follow this series on twitter, I've created a Moment to collect all the tweets for this series: twitter.com/i/moments/118141162861...
Here you go -
View in full screen - jsitor.com/p/VQMV_oPzY
View code - jsitor.com/VQMV_oPzY
Hi All,
Nice to join the challenges.
I guess it is not too late to join the challenge.
Here is my submission.
codepen.io/skay/full/bGGeraq
Used simple selectors and properties.
My take:
codepen.io/augustoqueiroz/pen/zYYxyrv