Responsive Layouts Workshop

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

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

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

    starting soon ends at 4:20 (serious)

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

      But only starts to become interesting at 7:14

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

    You can make a series about solving someone's website and if you were the front end developer what would you have changed something and made it even better.

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

    Thank you, Kevin, for all your amazing videos! I am new to CSS, and I really like your style of teaching. You explain it so well.

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

    Thanks. CSS Grib is a blessing

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

    This was the AI human that ai will never have. Was so refreshing to watch and just renew a lot of things again.

  • @tomaz-laurensoft
    @tomaz-laurensoft 2 หลายเดือนก่อน +2

    Kevin you are awesome :) I love CSS but with you the learning is amazingly fast, what a great Amazing Layouts Workshop \o/ ...

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

    Again thank you 🤩

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

    Thank you for this 😅

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

    Great 🎉 realtime topic sir

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

    you are amazing!

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

    thank you sir

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

    Lots of good information here, but went a little long. Looking forward to a naming convention episode. Thanks Kevin.

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

    Great Kevin like super man🦸🏻

    • @d-short2360
      @d-short2360 2 หลายเดือนก่อน

      2000 likes target = 👍🏻

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

    Another thing I would love to see from you, because your tool box is amazing, is for you to make a simple web site from scratch. When I mean simple, that might not be easy for you. Your mind is too complexed lol and make sure you name the css variables poopoo LMAO or whatever your son said lol. Like I want to see what stack you create it in. How you create your clr-variables. The whole css or sass variable list etc.. How you incoporate your buttons. I don't want to see it broken down into smaller videos unless it is in a list of all your videos into one. Like the first one could be the tools you use all the time, by tools your css variable that you know for sure you using in every project like earlier --clr ones. However, why you have so man y clr ones. I mean this video is phenomenal and shows so much of your thinking but you building a site from scratch. Not an ecommerce, just like maybe a simple portfolio from start to finish. If you use a stack or you not using a stack. Will you use typescript or js. I don't know if you even need tailwind or bootstrap but if you would use it when would you! implement it lol I know all your videos break it down but this is what I would like to see 2024 because 3 years ago you use REACT or something like that and this year you would choose .net, doubt it, or Vue and why you changed. I love your content I might even subscribe soon. ;)

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

    I need a solution to the following problem. I would be very happy if you had the solution. I have an image on the background and above it a white div, on the first half I have some inputs and on the second I would like to cut out a square with rounded corners (another div) to see the image that is underneath. How to do this in css?

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

    What do you think about creating mobile nav using popover in html?

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

    @20:47 - when you have trouble with responsiveness then youre the problem....
    no im not :) it vs code or the browser thats being a d*ck .... lol...
    nah, i totally agree with that statement, i spend a lot of my free time just playing with CSS,i dont start out with any final goal in mind, just play with CSS, sometimes i end up with happy accidents, other times i totally balls it up and break everything, its all part of the fun working out where i went wrong....
    my biggest setback is im good at the design and layout part but i totally suck at creating content for them

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

    I just need you to take a quick look and see if how messed up my site is lol then we can talkl responsiveness. I have not done anything to my portfolio just been on my fishing site nothing spectacular either lol

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

    i have a question client gave me figma on made for 1440p but he want exact same view like image from 1280 to 1920 to 2k screen, there were bunch of cards banners, grids , text boxes, how to achieve this ?? is it possible ?

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

      so wait, let see if I understood your question. You have a client who gave you a figma and they specifically wants that you match ALL dimensions of this figma file?
      easy answer, use px as unit
      complicated answer:
      first of figma uses canvas so all their views don't quite match real case web (meaning once you implement based on their px values you won't get same feeling of design)
      second, how I would do it professionally is to try to first understand the view and map everything as much you can in a ratio based. Stick to rem but % is also good, you need to make stuff responsive
      but here is where I get confused.. you say this is a client to you - is this a professional client or is this someone you know? Because your question is confusing and it doesn't sound like you are familiar with what you do, perhaps this video can teach you about responsive design and then try to apply that.
      If you are beginner (and of course there's no problem with that!) I would suggest you just try to match the design according to the figma, try maybe use px first but as you change your dimension you should quickly see how the design gets broken
      there's many ways to fix the same problem, and my main recommendation from all this is to learn plenty and of course one of the best way is by doing (you need to first understand your problem to really appreciate the solutions).
      Best of luck!

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

      I don’t know if this will help, onkelhoy1’s comment pretty much says it all!
      I’m Figma is you copy the artboard and press K or ctrl/cmd + k (one of both) it will show up a scale menu. You can scale the whole artboard based on a percentage or more importantly using hard values.
      It’s pretty easy for you to create all the different artboard sizes you want, but be cautious this will create values with decimals. Obviously we cannot use them so just round the values.
      If you don’t have a payed Figma account, just copy the whole artboard in a draft file of yours in order for you to scale or edit the design if you need to.

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

      Depends on what you mean by « same view » do you mean it need to scale to take the same proportion of the screen ? or does it need to stay same size on all screen ?

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

      ​ @maximemillat1771 ​ @onkelhoy1 ​ @xphstos_ thank you for your replies, i already mention ( same like image ) , imagine image of a person , where his nose is, eyes are etc, regardless you increase the size full width on desktop or on mobile image aspect ratio and parts inside it stays same sizes are propotion proper ,
      so me , well i am not newbie have made many websites but this was client who demanded this, mostly i fix the width on 1280 and design from 1440 figma designs,
      so even size is 2k my design is at max width 1280 so nothing goes out of order and even youtube linkedin does that,
      but his requirement was the design i see on 1440 , if person opens it on 2k screen it should exact same, and on 1280 it should looks same,
      so for font sizes i try to used clamp() min max etc but i did acheive 50 60% of what he wanted but it was too much time consuming and by looking at the replies i got it you guys have not faced such issue yet or a client like that so may be its not possible at all for now, i can use vw vh for fonts for certain cases but not for whole site,

  • @ВікторМайкут-п4ф
    @ВікторМайкут-п4ф 2 หลายเดือนก่อน +11

    Hello from Ukraine!

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

      eh, what's so special about being from Ukraine?

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

      Hello from India

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

      Nazi headz​@@ghaithzakk

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

      Hello from Russia

    • @ВікторМайкут-п4ф
      @ВікторМайкут-п4ф หลายเดือนก่อน

      @@dimtodim hou mean russians?