These CSS PRO Tips & Tricks Will Blow Your Mind!

แชร์
ฝัง
  • เผยแพร่เมื่อ 20 พ.ย. 2024

ความคิดเห็น • 391

  • @coding2go
    @coding2go  6 หลายเดือนก่อน +157

    Hope you guys learned something new. Feel free to share your own css tricks in the comments for others to see 😎
    Edit: I uploaded the source code for the tips on my website if you guys wanna check it out: www.coding2go.com

    • @MAALTECH
      @MAALTECH 4 หลายเดือนก่อน +3

      Subscribed immediately

    • @meew7571
      @meew7571 4 หลายเดือนก่อน +1

      Bro god will blessed you for this tutorial. you just shared some cool tricks and explain it perfectly. hope you will share more tricks with great explanation like this.

    • @DrClappinCh33ks
      @DrClappinCh33ks 4 หลายเดือนก่อน

      Very good video just subscribed. Please keep the vids coming

    • @ashwinbarnwal1281
      @ashwinbarnwal1281 4 หลายเดือนก่อน

      One trick I knew so far : to follow css-tricks.com

    • @haginss
      @haginss 3 หลายเดือนก่อน

      Very simple tutorial. Great content bro.

  • @sandarushashinda6912
    @sandarushashinda6912 4 หลายเดือนก่อน +962

    bro got straight in to the point, didn't waste a single sec of my life, worth it

    • @James-the-elder
      @James-the-elder 4 หลายเดือนก่อน +4

      Thought i was in like the 12th second or something 😂

    • @strawberrycake8253
      @strawberrycake8253 3 หลายเดือนก่อน +5

      and they are actually useful tips

    • @AhmedAshraf-a.a4raf
      @AhmedAshraf-a.a4raf 3 หลายเดือนก่อน +1

      I wasted by reading urs

    • @a_changedworld
      @a_changedworld 2 หลายเดือนก่อน

      I'll be wasting my own life, thank you very much.

    • @YourChenlambec
      @YourChenlambec 2 หลายเดือนก่อน

      I was literally going to skip the vid until I saw your comment

  • @dedse3
    @dedse3 3 หลายเดือนก่อน +204

    I just got bombarded with information, not a single second to think about anything else rather than the CSS tips, just perfect!

  • @militarykaliber-rp7ss
    @militarykaliber-rp7ss 4 หลายเดือนก่อน +91

    I love how straight to the point you are, no lengthy intro no bullshit, i just love it , you got a new sub

  • @madhavanair3744
    @madhavanair3744 6 หลายเดือนก่อน +76

    That glass effect was super awesome 🥶

  • @lonesakib01
    @lonesakib01 3 หลายเดือนก่อน +75

    Bro is the GOAT of CSS 💀

  • @darknezx9542
    @darknezx9542 4 หลายเดือนก่อน +73

    Incredible content, no BS, just tip after tip

  • @Htbaa
    @Htbaa 4 หลายเดือนก่อน +32

    For accessibility concerns please don't misuse a checkbox for that purpose. Other than that some awesome tricks in here, especially the snapping slider.

    • @Semmelein
      @Semmelein 3 หลายเดือนก่อน +2

      Why not? In what way is this a problem with accessibility?

    • @Htbaa
      @Htbaa 3 หลายเดือนก่อน +11

      @@Semmelein because a checkbox alone tells nothing about the state of a menu. Just even try operating this example in a blind test with a screen reader.

    • @HIHIQY1
      @HIHIQY1 หลายเดือนก่อน

      @@Htbaa that's where aria tags come into play though

    • @WhiskerCat09
      @WhiskerCat09 4 วันที่ผ่านมา

      I never think about accessibility for my projects, they are the type of projects where if you have the problem with accessibility on it you're not even going to be able to properly use the service to begin with lol

    • @Htbaa
      @Htbaa 4 วันที่ผ่านมา

      @ “lol” 🙄. Depending on your customer target country laws might require you to build digital accessible services. It’s not really an option anymore. In Europe with B2C you’re required to build accessible websites, apps, terminals etc. In some cases your company might be exempted.

  • @manfromexistence
    @manfromexistence 4 หลายเดือนก่อน +37

    Bro, I watched so many CSS tricks but this trick you gave is so awesome. Thanks bro, I didn't realize until now that ':not' and ':has' CSS new selectors can be so useful and CSS scroll trick is also so awesome too. Thanks a lot!!!

  • @tiendatniit
    @tiendatniit 4 หลายเดือนก่อน +7

    Your video is really awesome! Eight years ago, I was completely focused on backend development. Only now am I realizing how much CSS has changed. It's crazy!

  • @RobertWildling
    @RobertWildling 4 หลายเดือนก่อน +7

    Love the scroll-snap! Thank you vey much! Also the straight-to-the-point character of your tutes is highly appreciated! Subscribed!

    • @coding2go
      @coding2go  4 หลายเดือนก่อน

      Thank you! I appreciate the kind words. Welcome to the channel 👋

  • @Digital_1mpulse
    @Digital_1mpulse 4 หลายเดือนก่อน +7

    That background-filter is awesome. Always wondered how that worked. Clamp is a nice to know as well! Learned something new. Appreciate the video!

    • @coding2go
      @coding2go  4 หลายเดือนก่อน +1

      Thank you

  • @lucianminea
    @lucianminea หลายเดือนก่อน +1

    Just PERFECT ! Simple, concise and to the point !

  • @SebastianPerezDev
    @SebastianPerezDev 4 หลายเดือนก่อน +9

    Gradient trick for text is awesome, dude, thank you

    • @coding2go
      @coding2go  4 หลายเดือนก่อน

      Glad you like it!

  • @yeetskeet691
    @yeetskeet691 3 หลายเดือนก่อน +1

    I absolutely love CSS, I’ve used the label trick before for dropdown messages. CSS is amazing

  • @OpeNinGCA
    @OpeNinGCA หลายเดือนก่อน

    Great work, I usually dont comment or like videos but Sir you deserved that. Great work, straight to the point and no selling scatchy courses. love it, keep it up!

  • @FilipeFreire
    @FilipeFreire หลายเดือนก่อน

    I love this type of content delivery. super straight to the point while adding as much value as possible! Awesome job Fabian & Pavel! 👏👏

  • @Beingbasu
    @Beingbasu 6 วันที่ผ่านมา

    Just completed basic CSS . Thanks for upscaling tips ❤

  • @SnakesRaven
    @SnakesRaven 2 หลายเดือนก่อน +5

    Everything the others already said: straight to the point, no BS and useful. So refreshing. New sub!

  • @emilhozan71
    @emilhozan71 3 หลายเดือนก่อน +4

    I'm big into JS-less sites and this video was fantastic. Such innovative design concepts - not to mention artistic and highly appealing.
    Earned a sub from me!

  • @ShashankNaithani
    @ShashankNaithani หลายเดือนก่อน +1

    thank you very much. I was trying scroll with js in the last few days. excited to try out purely in css.

  • @yavuzselimdogan9852
    @yavuzselimdogan9852 หลายเดือนก่อน +2

    I am developing web apps since 2012. I feel like a junior as if I start coding today while watching. Dont make us feel miserable please :)

  • @tejasshekar
    @tejasshekar หลายเดือนก่อน

    Like everyone said, not a single second of my time was wasted. Definitely deserves a like and subscribe.

  • @Jobbled-teaches-IT
    @Jobbled-teaches-IT 11 วันที่ผ่านมา

    That scrolling part has been just what I have been looking for. Thank God for you Bro!!!!! :)) :))

  • @bakasenpaidesu
    @bakasenpaidesu 4 หลายเดือนก่อน +18

    Do you have CSS beginner to advanced course? If no then you should definitely make one I will surely buy it.

    • @coding2go
      @coding2go  4 หลายเดือนก่อน +13

      We are currently working on a CSS course. The plan is to publish the course next month. We will let you know when the course is available.

    • @bakasenpaidesu
      @bakasenpaidesu 4 หลายเดือนก่อน +1

      @@coding2go ok, roger sensei !!!

    • @coding2go
      @coding2go  2 หลายเดือนก่อน +5

      Hey there, you were asking for a CSS course a while ago... I wanted to let you know that we published it on Udemy a few weeks ago in case you are still interested. I don't know if you already got the info through our announcement video but I am letting you know anyways. I would be happy to have you as a student! You can get the course here if you haven't got it already: www.udemy.com/course/learn-html-and-css-in-7-days-web-developer-bootcamp/?referralCode=8054BF2C4D86FC75DB00

  • @Supertramp133
    @Supertramp133 25 วันที่ผ่านมา

    They ARE mindblowing!! Definetely gonna use them, thank you!!

  • @Moamal-Alaa
    @Moamal-Alaa 4 หลายเดือนก่อน +3

    Great video bro, Just one thing you haven't mentioned in the video, If you rely on checkbox inputs to toggle the menu you have to make sure it won't ruin the accessibility, and as you mentioned users won't notice but the browsers, so becareful when you use checkboxes for other purposes.

  • @EmperorInfern0
    @EmperorInfern0 3 หลายเดือนก่อน

    Oh my god. I bookmarked this just to refer to it again and again. Buddy, THANK YOU!!!

  • @redflowerorigamipapercraft
    @redflowerorigamipapercraft 23 วันที่ผ่านมา

    This guy deserves 99999999 Billion likes and subscribers ❤
    Edit: please do not skip ads cuz this is the only financial help we can do

  • @nitrousdx5754
    @nitrousdx5754 3 หลายเดือนก่อน

    That card snapping is a game changer for me! Good thing I stumbled upon on this channel. You earned a sub!

  • @phoneywheeze
    @phoneywheeze 17 วันที่ผ่านมา

    6:25 or just use ordered list with number list type?

  • @acryliq
    @acryliq 2 หลายเดือนก่อน

    From the first second you got my interest. At 60 seconds mark you convinced me to subscribe which I do not do that often. Thank you for a very useful video!

  • @gautam_nath
    @gautam_nath 3 หลายเดือนก่อน

    Being a UI developer for 5 years, I swear I learnt a lot new things today

  • @darigames2859
    @darigames2859 4 หลายเดือนก่อน

    This is genuinely one of the best tips and tricks videos I’ve seen

  • @wlockuz4467
    @wlockuz4467 3 หลายเดือนก่อน

    The scroll-snap blew my mind! Instant sub.

  • @letmewatch.
    @letmewatch. 3 หลายเดือนก่อน

    More like these! Absolute learnt a ton. An 8 minute video I spent over an hour watching trying everything out. I absolutely am stunned!

  • @TrendingShorts-5G
    @TrendingShorts-5G 4 หลายเดือนก่อน +5

    please make more video on css and one thing you do different is first you visualize the problem and then provide solution this is really amazing and helpful for beginners

    • @coding2go
      @coding2go  4 หลายเดือนก่อน

      Thanks, will do.

  • @TheCebulon
    @TheCebulon หลายเดือนก่อน

    These are valuable „tricks“.
    I always was amazed how easy every one of these are achieved.
    Thank you.

  • @SUNNY-BB
    @SUNNY-BB 3 หลายเดือนก่อน +1

    This Dude is the G O A T of CSS

  • @StCreed
    @StCreed หลายเดือนก่อน

    Halfway through and I already got at least one really good tip. That's pretty amazing.

  • @julianzenker824
    @julianzenker824 29 วันที่ผ่านมา

    best CSS related video on the tubes!!

  • @mrcash1309
    @mrcash1309 3 หลายเดือนก่อน

    Im doing web development since 5 years now. Where have you been all that time? Amazing content, subscribed!

  • @devinda_me
    @devinda_me หลายเดือนก่อน

    To the point, great pacing and excellent examples ! Literally what I was looking for ❤

  • @rongitmukherjee
    @rongitmukherjee 4 หลายเดือนก่อน +5

    That was no bullshit straight to the point, informative, clean and helpful. New subscriber here.

    • @coding2go
      @coding2go  4 หลายเดือนก่อน

      Thanks, glad you like it! Welcome to the channel ✌️

  • @jgerton
    @jgerton หลายเดือนก่อน

    immediately to the point AND learned new css tricks. thanks! you got my sub

  • @garryalfonso1609
    @garryalfonso1609 3 หลายเดือนก่อน

    Love it! The TH-cam Algorithm should recommend you. I gave you a thumbs up 👍.

    • @coding2go
      @coding2go  3 หลายเดือนก่อน

      Thank you 💙

  • @twign6378
    @twign6378 หลายเดือนก่อน

    Great video with zero filler 👏

  • @JoystickStereo
    @JoystickStereo 3 หลายเดือนก่อน

    I didn't know about scroll snapping-that's dope. That new morphism one is cool too

  • @danhloc112
    @danhloc112 หลายเดือนก่อน

    That is awesome!. Some tricks are so MINDBLOWING. Thanks bro!

  • @martinharyanto4465
    @martinharyanto4465 3 หลายเดือนก่อน

    Auto subscribe. Very clean and detail explanation. Straight forward and showing examples directly. ❤

  • @user-hw9cs6te5y
    @user-hw9cs6te5y 3 หลายเดือนก่อน

    This is the perfect video!! Thank you very much, I learned a lot of new, interesting and useful things in just 8 minutes. Keep up the good work!

    • @coding2go
      @coding2go  3 หลายเดือนก่อน

      Glad you liked it!

  • @TheSengard
    @TheSengard หลายเดือนก่อน

    So many new information for me. Thanks. Will help in future Webdesign.

  • @Undrios
    @Undrios 2 หลายเดือนก่อน

    • min(800px, 90%) / max()
    If the screen is bigger than 800px it will take 800px size
    If the screen is smaller than 800px it will take 90% of the screen
    • clamp(width, min-width, max-width)

  • @devilrjn1587
    @devilrjn1587 3 หลายเดือนก่อน

    Thanks brother. I am coding from years but didn't know these features exist.

  • @bhaimohsin
    @bhaimohsin 2 หลายเดือนก่อน +1

    5:37 -- Great Trick!

  • @arac4nia
    @arac4nia 3 หลายเดือนก่อน +1

    Finally found a decent view on CSS. 🎉

  • @lacuevadelinsecto
    @lacuevadelinsecto หลายเดือนก่อน

    I can watch this video the whole day. Just a lot of useful tips and triks!

  • @yumyum7196
    @yumyum7196 หลายเดือนก่อน

    This video was great! I’m immediately going to update a lot of things to these

  • @coel312
    @coel312 3 หลายเดือนก่อน +1

    This is a great video! Just a question, are most of these features supported by most modern browsers? They seem kind of new

  • @Baccardi151
    @Baccardi151 4 หลายเดือนก่อน +8

    Learned alot, & you didn't waste any time, much appreciated

  • @commandstring
    @commandstring หลายเดือนก่อน

    The snap scrolling is one I'll definitely be using more often.

  • @PhucTran-zj5is
    @PhucTran-zj5is 4 หลายเดือนก่อน +2

    U gimme almost trick I don't know and still find it till I watched this video. Thanks
    ❤❤❤

  • @lewisone
    @lewisone หลายเดือนก่อน

    Your explanations are as clean as your code. Great job.

  • @bulolo_wilber
    @bulolo_wilber หลายเดือนก่อน

    6:30 Imagine the shock on my face when I learnt of counters, the time I'd have saved. That is a game changer to counter do all the work

  • @AA100HP
    @AA100HP 4 หลายเดือนก่อน

    Love these simple yet so useful videos! Keep up the good work! 🎉

    • @coding2go
      @coding2go  4 หลายเดือนก่อน

      Thank you! Will do!

  • @pawanbhatt9329
    @pawanbhatt9329 3 หลายเดือนก่อน

    No time waste to the point always love it ❤

  • @ВолодимирБарибін-е8у
    @ВолодимирБарибін-е8у หลายเดือนก่อน

    Wow, It's fantastic! Thank you for the video!

  • @gareth2021
    @gareth2021 3 หลายเดือนก่อน

    Great Video, learned something new and rest is definitely helpful and I would have needed sometime ago :). Btw Like the „straight to the Point“ Style

  • @sovereignlivingsoul
    @sovereignlivingsoul 2 หลายเดือนก่อน

    it's easy to fall into javascript, thanks for the reminder, i use tabs quite often to create multi-page elements, just for fun, great video, subbed

  • @jeloi9364
    @jeloi9364 3 หลายเดือนก่อน

    amazing tips! clear and concise explanation. Great job! :)

  • @Ayaz-f2s
    @Ayaz-f2s 9 วันที่ผ่านมา

    Bro deserves infinity subscribers ❤

  • @shfunky
    @shfunky 4 หลายเดือนก่อน +3

    Nice one! First time seeing many of these.

  • @DevenSitapara
    @DevenSitapara 4 หลายเดือนก่อน

    Loss of devs appreciate this kind of teaching approach

  • @redakker
    @redakker 3 หลายเดือนก่อน

    Thank you so much! Explanation and presentation are awesome! Keep going in this way

  • @TheWellington1997
    @TheWellington1997 3 หลายเดือนก่อน

    Amazing video, straight to the point, won a subscriber

  • @OpinionatedAnon
    @OpinionatedAnon 3 หลายเดือนก่อน

    I began coding when I was 17. I took a hiatus and now the game has completely changed. Wow.

  • @denhamk
    @denhamk 4 หลายเดือนก่อน

    Wow. That text gradient trick was 🔥!! Next can you show me how you blur the background when I hover over my megamenu 🤪 (like apple’s website?) 😉

  • @CRUSHED_GREMLIN_RL
    @CRUSHED_GREMLIN_RL 2 หลายเดือนก่อน

    In every single way this video made me realize I should not claim I know css,
    And a learning mistake I did is that I should've treated CSS like a programming language too

  • @vasiovasio
    @vasiovasio หลายเดือนก่อน

    Great video! Thank you! 😊😊😊

  • @yashkhawale
    @yashkhawale 6 หลายเดือนก่อน +2

    Really helpful video. Like your simple way of teaching.
    Could you please create a multi page website building video using html, CSS and js?

  • @lindanigrootboom4634
    @lindanigrootboom4634 2 หลายเดือนก่อน

    🔥🔥🔥 Learned a lot from TH-cam today

  • @rahul360_
    @rahul360_ 3 หลายเดือนก่อน +1

    Bro I really want to more videos like this...
    It's really helpful me❤

  • @MattBramer
    @MattBramer 3 หลายเดือนก่อน

    🔥. Thank you for this! Feeling inspired!!

  • @kunal007216
    @kunal007216 2 หลายเดือนก่อน

    So wonderful...I knew few but others are just mind blowing...Subscribing you right away.

  • @halynakyryliuk8484
    @halynakyryliuk8484 3 หลายเดือนก่อน

    Amazing! Si much interesting tricks! Bravo!!!

  • @mrjohncrumpton
    @mrjohncrumpton 3 หลายเดือนก่อน

    Excellent. The missing space after the class name and open squirely brackets is getting to me!

  • @steel_hat_pirates
    @steel_hat_pirates 2 หลายเดือนก่อน

    The counter reset headings one was really helpful~

  • @ac.23z
    @ac.23z หลายเดือนก่อน

    Best css animation and explanation 👏🚀

  • @Belladonna_khaday
    @Belladonna_khaday 3 หลายเดือนก่อน

    Bro Thank you so much❤❤. This video is incredible and it worth to watch. You earned one more subscriber.

  • @DariánCapoteQuintana
    @DariánCapoteQuintana 3 หลายเดือนก่อน

    Thanks for these great CSS tips.

  • @cwm161
    @cwm161 6 หลายเดือนก่อน +3

    These are very helpful thanks for sharing ❤

  • @1230124
    @1230124 4 หลายเดือนก่อน

    you make it very simple and clear~! thanks a lot!!

  • @naweendanushka3358
    @naweendanushka3358 4 หลายเดือนก่อน +1

    Great video, I have only known about :hover pseudo class

  • @bas9534
    @bas9534 3 หลายเดือนก่อน

    thx for the tip, now time to give this lesson a try on real code.
    ps. like the way you straight in to the point ❤

  • @egorovsa
    @egorovsa หลายเดือนก่อน

    last trick with slider was really on time for me ) thanks )

  • @MiHawk-jn9oq
    @MiHawk-jn9oq 3 หลายเดือนก่อน

    i love how you teach us the slide with snap. can you also upload a video how can you make a carousel type. for example, we have 5 slides, and after scolling the 5th slide, the one will popup is the 1st slide again.

    • @coding2go
      @coding2go  3 หลายเดือนก่อน

      Sure, I will make a video on that, though it needs some time until it comes out.

  • @zainaltaf5460
    @zainaltaf5460 3 หลายเดือนก่อน

    great tips, straight in to the point

  • @harshrawat503
    @harshrawat503 44 นาทีที่ผ่านมา

    just looking for this type of content thanks brahhhh

  • @aliulanowar7802
    @aliulanowar7802 หลายเดือนก่อน

    excellent as well helpful , thanks a lot for providing that content .

  • @fullStackInKannada
    @fullStackInKannada หลายเดือนก่อน

    Very useful video, I really liked it! Thank you :)