Day 5: Discovered css property 'text-decoration-skip: ink'
What I’ve done today
- Adding a profile pic to my diary
- Adding Structured Data to diary (author)
- Refined styling
- Added the current day to the link description generated for twitter and facebook
- Use flexbox to align icons and text on post list
I learned about a css property to make underlined links look more nice:
The result can be seen if you hover over links on this page: The underline does not cross through the descender of letters anymore.
Learn more about text-decoration-skip
It can already be used because it degrades gracefully.
See the Pen text-decoration-skip by Nicolas Hoizey (@nhoizey) on CodePen.
Use flexbox to align icon and text
I used the technique described in this codepen for the icon+text in the post list.
This makes them align correctly also on mobile
See the Pen Flex-Box dynamic width, auto-width by Andre (@ingomc) on CodePen.
What I’m planning to do next
Finally work on the portfolio
- there are some really nice css props that finally work in modern browsers
Link Dump for today: