Share this page!

Pratham Profile picture
Twitter logo
24 May, 24 tweets, 6 min read
A long list of all CSS tips and tricks I shared here ๐Ÿงต๐Ÿ‘‡๐Ÿป
1. Smooth scrolling

2. Change marker styling
3. Add styling to video subtitle

4. Change input caret color

5. Typewritter effect using pure CSS

6. Customize text selection

7. Zoom image on hover

8. Customize first letter

9. Pure CSS image carousel

10. Comma separated list

11. Text outline using 1 CSS property

12. Customize list style type

13. Style range input

14. 3D elements using CSS

15. Optimize the performance

16. Create round text

17. Wavy underline

18. Truncate text using CSS

19. Negative selector

20. Prevent text selecting

21. Make div scrollable

22. Image reflection

23. Image rendering

โ€ข โ€ข โ€ข

Missing some Tweet in this thread? You can try to force a refresh
ใ€€

Keep Current with Pratham

Pratham Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!

PDF

Twitter may remove this content at anytime! Save it as PDF for later use!

Try unrolling a thread yourself!

how to unroll video
  1. Follow @ThreadReaderApp to mention us!

  2. From a Twitter thread mention us with a keyword "unroll"
@threadreaderapp unroll

Practice here first or read more on our help page!

More from @Prathkum

Pratham Profile picture
26 May
5 great code snippet websites for every web developer and designer

๐Ÿงต๐Ÿ‘‡๐Ÿป Image
1๏ธโƒฃ 30 Seconds of Code

- Short code snippets for all your development needs

๐Ÿ”— 30secondsofcode.org Image
2๏ธโƒฃ Free Frontend

- Free hand-picked HTML, CSS and JavaScript (jQuery, React, Vue) code examples, tutorials and articles

๐Ÿ”— freefrontend.com Image
Read 6 tweets
Pratham Profile picture
26 May
Introduction to React Hooks โ†ช๏ธ

Hooks let you manage state and other React feature without writing the class component. It was first introduced in React 16.8

Let us try to understand it in more detail ๐Ÿงต๐Ÿ‘‡๐Ÿป Image
Starting with the discussion on some key point about React hooks ๐Ÿ‘‡๐Ÿป
๐Ÿ“Œ What exactly hooks are?

- We can consider hooks as a JavaScript functions which takes some parameter and return something accordingly. But they servers some complex functionality like managining state and other React features
Read 25 tweets
Pratham Profile picture
25 May
5 GitHub repositories for you if you're learning HTML, CSS and JavaScript

๐Ÿงต๐Ÿ‘‡๐Ÿป
1๏ธโƒฃ JavaScript questions

- A long list of (advanced) JavaScript questions, and their explanations

๐Ÿ”— github.com/lydiahallie/jaโ€ฆ Image
2๏ธโƒฃ Microsoft web dev course

- This is a super cool GitHub repo by Microsoft for learning web development for beginners

๐Ÿ”— github.com/microsoft/Web-โ€ฆ Image
Read 6 tweets
Pratham Profile picture
25 May
A complete introduction to CSS animations ๐Ÿš€

CSS animation is a module in CSS that lets you change the styling of elements and therefore creates an animate effect. It's little tricky but not much

Let's learn about it ๐Ÿงต๐Ÿ‘‡๐Ÿป Image
Before diving into it, we need to understand the importance of CSS animations

Animation can establish interaction between users and the user interface. This makes your website more interactive which ultimately attracts more visitors to your webpage.
CSS animations is little tricky but not too tough to master. In this thread, we will try to gain some decent knowledge about it.
Read 22 tweets
Pratham Profile picture
23 May
Here is a curated list of threads in chronological order that can help you learn the entire CSS ๐ŸŽจ

๐Ÿงต๐Ÿ‘‡๐Ÿป
1. Kickstart your CSS journey with this thread. It will give you a quick overview โœ๏ธ

2. First and foremost, learn about box-model, it will cover height, width, margin, padding and border ๐Ÿ“ซ

Read 15 tweets
Pratham Profile picture
23 May
Web Layout ๐Ÿ–ผ

Structuring your website is essential as it provides better navigation and visualization of the content available on the site. Let's talk a little more about it and learn how we can create a proper layout

๐Ÿงต๐Ÿ‘‡๐Ÿป
Web layout aims for presenting imformation in a logical manner and to make the important elements stand out.

A well designed layout can catch more traffic on your website and make your content easy to understand
๐Ÿ“Œ Design vs Layout?

Web layout is closely related to designing part. But we can say that web designing is much more than the layout only. It covers images, text, color scheme, typography and layout

On the other hand, Layout is all about arrangement of element on the webpage
Read 22 tweets

Did Thread Reader help you today?

Support us! We are indie developers!

This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Too expensive? Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal Become our Patreon

Thank you for your support!

Follow Us on Twitter!

Like this author's thread?

Get emails when @Prathkum has new unrolls!

Check out other threads from @Prathkum!

Read all threads by @Prathkum

:(