DEV Community

Cover image for February: Forem Twitch Events Roundup ๐Ÿ‘พ
Christina Gorton for The DEV Team

Posted on

February: Forem Twitch Events Roundup ๐Ÿ‘พ

In February, Nick Taylor and I kicked off another great month of Twitch streams. This is a round up of all the wonderful guests who joined us.

Pair Programming with Dann Ott

Dann Ott joined us to work on an open front-end issue.

`gap` doesn't work with `flex` on Safari #12452

Describe the bug

I've been living thinking that gap (as well as grid-gap) works perfectly fine with flex elements. Today I learned it's not supported in Safari which means there's a missing whitespace in Safari which I have already confirmed testing few views.

That means we have to fix all instances of a combination of two utility classes flex with gap-* in our views (.html.erb, .js, .jsx) AND also all instances of similar situation but in our SCSS files...

Yes, gap does work with grid but we should not simply replace every flex instance with grid because grid is for layout and flex is for components.

So in most cases we will have to remove gap property and replace it with additional margin on child elements...

To Reproduce

Test our site in Safari.

Desktop (please complete the following information):

  • Browser: Safari.

Smartphone (please complete the following information):

  • Browser: Safari

This bug occurred in Safari whenever we used the gap property on DEV.

We also talked about when to use CSS Grid, Flex-box and other alternatives.

Places to Follow Dan

Personal website:
Virtual Coffee:
Cleveland React:

Introducing Suzanne and Katie

We introduced and talked to our coworkers Katie Davis and Suzanne Aitchison.
We discussed a11y, JavaScript, developer tooling, working at Forem and more.

Places to follow Suzanne

Up Your A11y:

Pair Programming with Jono Yeong

We were joined by Jono Yeong to work on a markdown bug that appears in article titles.

Certain characters, like angle brackets, show up incorrectly in some article previews #2204

Describe the bug When viewing the /comments view of an article, the first line and a half or so of the article is displayed. If that first bit contains inline code with angle brackets, e.g. if you wrote:

this is an article about `<span>` tags

this appears in the article preview as: "this is an article about <span> tags".

To Reproduce Steps to reproduce the behavior:

  1. Go to ''.
  2. Enter minimal front matter, set `published: true, and enter:
this is an article about `<span>` tags
  1. Save the article.
  2. Navigate to {article URL}/comments.
  3. Observe the &lt;span&gt; in the preview text.

Expected behavior I expect the preview to say "This is an article about <span> tags"

Screenshots Example from: Screen Shot 2019-03-25 11:45 AM EST

Desktop (please complete the following information):

  • OS: macOS Mojave 10.14.3
  • Browser: Chrome 72.0.3626.121, Opera 58.0.3135.107

Places to Follow Jono

Twitter: โ€จ
Jonathan Yeong's Blog:
DEV profile:
Youtube Channel:

Walkthrough Wednesday with Todd Libby๐Ÿฆž

We were joined by Todd Libby to talk about a11y, web standards, lobster rolls ๐Ÿฆž and more.

Place to Follow Todd

Personal Site:
Front End Nerdery Podcast:
Front End Nerdery Podcast channel:

Thanks to all our viewers who joined the streams and chatted with us this month!

Be sure to follow the ThePracticalDev Twitch channel to check out all the great guests we have joining us every Wednesday this month.

Top comments (3)

brendamichellle profile image
Brenda Michelle

Just followed! I didn't know DEV had a Twitch channel ๐Ÿ˜Š

coffeecraftcode profile image
Christina Gorton


nickytonline profile image
Nick Taylor