Pratham Profile picture
28 Apr, 9 tweets, 3 min read
5 amazing CSS properties you won't believe really exist 🎨

🧡 πŸ‘‡πŸ»
1️⃣ touch-action

The touch-action CSS property sets how an element's region can be manipulated by a touchscreen user (for example, by zooming features built into the browser).

This propety accepts the following values πŸ‘‡πŸ»
2️⃣ will-change

You can optimize the performance of your web page by adding one line of CSS🀯

The will-change CSS property hints to browsers how an element is expected to change. It can increase the speed by doing potentially expensive work before they are actually required.
3️⃣ text-size-adjust

The text-size-adjust CSS property controls the text inflation algorithm used on some smartphones and tablets. Other browsers will ignore this property.
Many mobile browsers apply a text inflation algorithm to enlarge the text to make it more readable. When an element containing text uses 100% of the screen's width, the algorithm increases its text size, but without modifying the layout.
The text-size-adjust property allows web authors to disable or modify this behavior, as web pages designed with small screens in mind do not need it.

Read more about it developer.mozilla.org/en-US/docs/Web…
4️⃣ text-emphasis

The text-emphasis CSS property applies emphasis marks to text
Check out this example πŸ‘‡πŸ»
5️⃣ user-select

The user-select CSS property controls whether the user can select text.

Check out this pen for better understanding πŸ‘‡πŸ»

codepen.io/prathkum/pen/v…

β€’ β€’ β€’

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

29 Apr
10 HTML tips I bet you are not familiar with 🧡 πŸ‘‡πŸ»
HTML Tip 1

The input with type image defines an image as a submit button. With src attribute that specifies the link to the image ImageImage
HTML Tip 2

The "step" attribute specifies the interval between legal numbers in an <input> element

Suppose I want the user to only select Sundays in the input date then I'll mention the upcoming Sunday date with 7 stepsDown pointing backhand index Image
Read 11 tweets
29 Apr
6 amazing GitHub repositories that can help you in your web development journey

🧡 πŸ‘‡πŸ»
1️⃣ frontend-guidelines

- Some HTML, CSS and JS best practices.

πŸ”— github.com/bendc/frontend… Image
2️⃣ awesome-learning-resources

- Awesome list of resources on Web Development.

πŸ”— github.com/lauragift21/aw… Image
Read 7 tweets
29 Apr
The next 19 tweets will help you start your JavaScript journey with zero inconvenience

🧡 πŸ‘‡πŸ» Image
Some valid reasons why you should learn JavaScript

πŸ”Ή Currently used by 94.5% websites
πŸ”Ή Wide range of applications including mobile and desktop devices
πŸ”Ή Most in-demand language

{ 2 / 20 }
Here's a crash course of JavaScript by Freecodecamp.

Crash courses are just for quick look. Don't just stop learning after it. Keep exploring things by your own



{ 3 / 20 } Image
Read 20 tweets
27 Apr
5 simple single div CSS arts you can try 🎨

{ 1 / 5 } 🧡
2. Yin and Yang ☯️
3. Coffee β˜•
Read 5 tweets
27 Apr
These 13 web development code snippet websites can save you a lot of time

A thread 🧡
1️⃣ W3 Schools How to

- Well organized and easy to understand Web building tutorials with lots of examples of how to use HTML, CSS and JavaScript

πŸ”— w3schools.com/howto/default.…
2️⃣ Code My UI

- Handpicked collection of Web Design & UI Inspiration with Code Snippets.

πŸ”— codemyui.com
Read 14 tweets
26 Apr
5 amazing tips of CSS you need to know 🎨

🧡 πŸ‘‡πŸ»
1️⃣ Image reflection

You can create reflection of an image using one CSS property -webkit-box-reflect: below 0px linear-gradient(to bottom, rg
2️⃣ 3D element

The Perspective property helps you give your elements a 3D look.
Read 6 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!