How To Work With Designs & Create Pixel-Perfect CSS As A React Developer

Published: 19 August 2022
on channel: Profy dev
2,125
52

Learn how to create pixel-perfect CSS in your React apps and how to work with designs on Figma. This video is part of the React Job Simulator: https://profy.dev/waitlist

Resources used for the exercise:
Website: https://pixel-perfect-css.profy.dev
Figma design: https://bit.ly/3Qz7XdK

00:00 - First Marker
00:32 - Perfect Pixel Chrome Extension
00:47 - Export Elements From Figma
01:06 - Mismatch Between CSS & Design
01:32 - Debug CSS In Dev Tools
01:46 - Align The First Menu Item
02:16 - Strange Height - Design Mistake?
03:34 - Copy New Styles To Other Menu Items
03:56 - Exercise
04:33 - Exercise solution
05:05 - Yes, It's A Design Mistake
05:47 - Fix The Design
06:21 - Align Bottom Menu Items By Resizing Window
06:53 - Takeaways


Watch video How To Work With Designs & Create Pixel-Perfect CSS As A React Developer online without registration, duration hours minute second in high quality. This video was added by user Profy dev 19 August 2022, don't forget to share it with your friends and acquaintances, it has been viewed on our site 2,125 once and liked it 52 people.