Simplest CSS reset to prevent headaches 

Was just thinking the same. Good material to save and have around

Get Readwise or Pocket

I'm pretty sure you can go in to your history and save it to a playlist from there. I know you can on desktop, not sure about mobile though.

You can already save and favorite them. In the url replace "shorts/" by "watch?v=". Tada! A video you can save, pause, scrub, whatever your heart desires. What RU-vid actually needs to do is to stop breaking things that used to work..........

Just like the shorts and then go view it in your liked videos playlist

never understood those files, it's literally too much

Interesting for letter-spacing! True that it makes sense for inputs and buttons, since all the other typography is being inherited. I don't really like the idea of inherited the color for a or ::placeholder though. I guess it depends on the design, but in general, links should stand out in multiple ways (underline and color, for example), and ::placeholder being the same as regular text can make a form look like it's been pre-filled.

@@KevinPowell I agree.

This sir should be in the top

@@tejasvijb4228 thank you! I posted it since I had to rewatch the whole thing and pause it to get it all. I hate that you can't scrub these shorts.

this^

Pin this bad boy

lmao true

Dark mode's actually really hard on the eyes for people with astigmatism. Light mode is an accessibility feature

​@@complainer406also can be better for viewing on a screen outdoors in bright sunlight

I get headaches when trying to read websites in dark mode. Not sure why, but I would prefer having a toggle.

@@complainer406 As someone with very heavy astigmatism and glasses that currently don't compensate nearly enough for it, I can agree to this. Light mode is a lot easier and nicer to read.

This used to drive me crazy as well! Here's what you do: 1) 'like' the short 2) go to your Library > Playlists > Liked videos 3) click on the three vertical dots next to the short you 'liked' and that menu will have the Save to Playlist option

Strange, I managed to save it directly to a playlist as usual. Maybe it's different on desktop?

@@PeterJewell2 I almost exclusively watch shorts on my phone. I bet you’re right.

I go to history, and the 3 dots are there, with the save to playlist option. There's a few ways... Wouldn't it be nice if they just let you do it from the short tho? :)

Agreed, that would be a nice addition

I don't see how it would be, no. Two things though, when you say flickering, could you explain it more? It is shifting? If you're using web fonts, including Google fonts, it could be from those causing a shift when they load in. The other thing is awesome as Meyers reset was, it's a bit out dated now. There are several less aggressive ones that have become more widely used these days. Normalize might be the most common, but there are others too like Andy Bells reset, and a few others too

It does, I prefer to use html, body { height: 100%; }

That can cause issues with other things, like smooth scrolling and double scrollbars. Really the best is dvh, which I wanted to include, but didn't have the time to in a short, since going into the nuance of browser support isn't easy in a short 😅

I usually use html { height:100%} body { min-height: 100%; height:0} In case a dont want issues with scrollbars and i need something like a Hero banner taking the full height..

I haven't used a normalize in a long time now

@@KevinPowell not even -webkit-font-smoothing and -moz-osx-font-smoothing are necessary?

His latest video about "Container Blocks" explains this, actually. Basically comes down to you not always wanting the immediate parent to have position: relative for certain design styles

That comes with it's own issues, like easy smooth scrolling and potentially dealing with extra scrollbars (even if they are hidden). (I realize 100vh has it's own issues too, i wanted to talk about 100dvh, but not enough time in 60 seconds, so it'll have to be another video, lol)

@@KevinPowellso can we expect a dvh vid soon?

because they already have all of those. EDIT for more clarity: pseudo elements don't have a margin or padding by default, and will inherit all the font properties, so there's no need to declare any of those

Yes. Make sure to put this first in your links. FYI: I’m a beginner.

This will only switch if the user preference has been set to darkmode. If I user has lightmode, it'll use that.

That's not recommend anymore because it breaks accessibility. If a user with impaired vision sets his browsers default font size to 20, 24 or 32px, they won't be able to read your website. The only reason we used to set html {font-size: 62.5%} in the first place, was to make the conversion from pixel to rem units easier when implementing fallbacks to support older browser that don't support rem. (1rem = 10px) However rem has been supported by all browsers since 2010. So it's safe to say that anyone who uses a 12 year old browser has bigger concerns than font sizes. Just use rem without pixel fallback for font sizes. No need to support 12 year old browsers, but there is a need to support accessibility for different browser default font sizes.

@@Hobbitstomper What do you mean they wont be able to read the website? ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-pKX7YnkyR8g.html this video does a great job at explaining how using rem affects a website compared to pixel values and he doesn't even mention using pixel values as fallback.

​@@Issvor html {font-size: 62.5%} breaks accessibility because it makes the default browser font sizes ~40% smaller. So when someone with impaired vision sets their default browser font size from 16px to 28px because 16px is too small for them and you then set html {font-size: 62.5%}, now instead of the user getting 28px font size, they get 17.5px font size which makes it again too small for them to read. Just dont use html {font-size: 62.5%} and don't use pixels for font-sizes, use rem. html {font-size: 62.5%} was only used to make the conversion between rem and pixel easier (10:1). I am saying use rem only and not pixel. No need for pixel unit when using font-size. We used to use both, rem and pixel at the same time as fallback for browsers that dont support rem, but those browsers are now 12 years old and there is no need to support them.