Create Responsive Image Gallery Using HTML and CSS

Sdílet
Vložit
  • čas přidán 27. 08. 2024

Komentáře • 99

  • @Tech2etc
    @Tech2etc  Před 4 lety +20

    What do you think about this tutorial?
    Comment Now !....Let me know some of your opinion🥰

    • @studentwiut8467
      @studentwiut8467 Před 3 lety

      perfect, where did you get images

    • @shubham53kumar
      @shubham53kumar Před 2 lety

      @@studentwiut8467 from pixels, unsplash and many more...

    • @kylekeledomson6772
      @kylekeledomson6772 Před 2 lety

      Awesome designs, your ideas are different and I like it

    • @Tech2etc
      @Tech2etc  Před 2 lety

      @@kylekeledomson6772 Thank you.

    • @sayyidnaeemulhaqm.k8966
      @sayyidnaeemulhaqm.k8966 Před rokem

      Thanks .Tomarrow my task is make a Page design ...then i found image gallery in that task so i watch this video thanks ..i found some loats of ....Flex ideas ...and @media screen ideas Thanks sir and also i follow you....

  • @am1n_dlt682
    @am1n_dlt682 Před 2 lety +36

    The images have a style of border-radius :15px; so this style should apply for all 4 corners of the image but, for anyone who's wondering why the images doesn't have border-radius on their bottom left and right, its because they have style which is padding-bottom : 15px; , you should replace this style by margin-bottom:15px and the problem should be fixed.

  • @aryanyadav4757
    @aryanyadav4757 Před 2 lety +6

    I guess this guy is a perfect example of why communication skills are important. There was so much he knew and wanted to share but the words were getting in the way. But still learned a lot so thanks for that.

    • @RAVIRAJLADHA
      @RAVIRAJLADHA Před 2 lety +1

      yeah, his skills are very poor. well said

  • @DigitalLiquid
    @DigitalLiquid Před 2 měsíci

    Thank you so much! After many videos, this was the only one that worked!

  • @yunoletmehaveaname
    @yunoletmehaveaname Před rokem +1

    You don't need to specify .container .box .anything in this way. Your classes are specific enough and you're just adding unneeded complexity and unreadability to your css.
    Great demonstration though! It was a nice walkthrough.

    • @aijiexi
      @aijiexi Před 2 měsíci

      In his defense, he's being very specific so that a developer who comes behind him can find the class easily...

  • @h.t.7310
    @h.t.7310 Před 2 lety

    Goot gawd dis man is a genius in presentation! Subscribed! Super duper flash learning!

  • @Faby__
    @Faby__ Před 2 lety

    i modified it a little bit with redirects to other pages i've done and very good, thanks!

  • @sydneyjack410
    @sydneyjack410 Před rokem

    awesome!!!! this was really good, and thank u so much for providing code

  • @skullncrossdrones7960

    Great video. Really helped me hand code my first responsive website.

  • @SurfingTheMentawais
    @SurfingTheMentawais Před 3 měsíci

    Thank you for the wonderful explanation. You do great work.

  • @gabikka1722
    @gabikka1722 Před rokem

    Wow, this was a great tutorial. I needed something straight forward and simple but the best part is in your presentation. Thank you and I will definitely subscribe to your channel. Keep up the good work!

    • @Tech2etc
      @Tech2etc  Před rokem +1

      You're very welcome!
      More projects are coming soon.
      Please share this project on your social media. It will help us. Thanks.

  • @salemmajed916
    @salemmajed916 Před 8 měsíci

    Thank you for this information and explanation

  • @bogdanv9591
    @bogdanv9591 Před 2 lety +1

    Excatly what I needed, thanks

  • @cecilec9234
    @cecilec9234 Před 2 lety +1

    You explained everything in wonderful detail. Thank yoouuuu!!

  • @boomondobade706
    @boomondobade706 Před 2 měsíci

    Amazing

  • @kmssi1538
    @kmssi1538 Před 2 lety

    Very Informative.Thanks!

  • @ritikbheda9183
    @ritikbheda9183 Před 2 lety

    Thank you for this tutorial! It helped me.

  • @yohohogaming6
    @yohohogaming6 Před rokem

    thank you so much bro for the tutorial

  • @niteshprajapat7918
    @niteshprajapat7918 Před 2 lety

    This is amazing ❤️😀 Loved this

  • @intc21
    @intc21 Před rokem

    Great video, thank you!

  • @user-pw1sy8wl6k
    @user-pw1sy8wl6k Před 2 lety +1

    Great tutorial!!! Thank you!
    One question - how do I make the "more" button work?

  • @manishsoni8760
    @manishsoni8760 Před rokem

    perfect tutorial

  • @harsh5128
    @harsh5128 Před rokem

    great ❤❤

  • @bananabutzz
    @bananabutzz Před 9 měsíci

    thanks man that was helpful

  • @kiovo1983
    @kiovo1983 Před 7 měsíci

    thanks man, appreciated

  • @shantanusevekari2809
    @shantanusevekari2809 Před rokem

    I need help:I have created a new folder css and inside style. Css but whenever I go into that file for styling it doesn't work. Pl help.

  • @ClubScene231
    @ClubScene231 Před 2 lety

    This tutorial is very usefull for me

  • @UGH_ZEREF3431
    @UGH_ZEREF3431 Před 4 měsíci

    thank you sir

  • @ahnatechnology5998
    @ahnatechnology5998 Před 3 lety +1

    thanks a lot, that was helpful, and very well explained, i m wondering about "more" button, how can i use it, i mean if i want to add more pictures and i want it to show up after clicking the "more" button

    • @Tech2etc
      @Tech2etc  Před 3 lety +4

      u can duplicate the current page & link this page with more button.

  • @mcroman-superfeat
    @mcroman-superfeat Před 8 měsíci

    Ciao, ::: Can I use the KEYBOARD ARROWS to slide the Gallery to Left or Right ... ? THX ... /// McRoman

  • @sanjanabhat5032
    @sanjanabhat5032 Před rokem +1

    great tutorial! can we make the images align at the bottom also ?

    • @christian108
      @christian108 Před měsícem

      i was thinking of trying justify-content: space between;

  • @akinsulereolajobi9168
    @akinsulereolajobi9168 Před 2 lety

    Thank you so much for this.

  • @marriageVideos933
    @marriageVideos933 Před rokem

    How to create ,when we click on image ,show that in pop-up..like Amazon product zoom

  • @roshnapjohn1654
    @roshnapjohn1654 Před rokem

    Thank You.

  • @Englishready-ez3ei
    @Englishready-ez3ei Před rokem

    Thanks Buddy

  • @sagaibrahim6178
    @sagaibrahim6178 Před rokem

    what app are you using to test your site at difference scales?

  • @kinzag7613
    @kinzag7613 Před 2 lety

    I tried this but it's not showing the left-side scroll option.

  • @Georgian151
    @Georgian151 Před rokem

    nice vid

  • @mysteriousone1606
    @mysteriousone1606 Před rokem

    Hello, the source file is not accessible now. Please reply with the correct source file. Loved your work!

  • @TechExplosions
    @TechExplosions Před 3 lety

    really helpful

  • @ClubScene231
    @ClubScene231 Před 2 lety

    Thank u
    Thank u
    Thank u so much

  • @programmertik2046
    @programmertik2046 Před 3 lety

    Bro it was great 👍👍

  • @xcr6436
    @xcr6436 Před 2 lety

    Thanks bro for this videp

    • @Tech2etc
      @Tech2etc  Před 2 lety

      Thank you so much. Please share this project on your social media. Will appreciate that.

  • @dokterkepin9652
    @dokterkepin9652 Před 2 lety

    good video

  • @asphaltking5870
    @asphaltking5870 Před 2 lety

    Please can you show me how can I do for having two columm for max-width =998 px divices ?

  • @ItsItachi279
    @ItsItachi279 Před 2 lety

    TYSM bro ❤

  • @bloomyredwood2279
    @bloomyredwood2279 Před 2 lety

    Hi, i'm sorry if you explained this already, but could you explain why you do those indent spaces in code?
    like the indent on line 8 and then another one on line 9

  • @user-df4vp1gd9w
    @user-df4vp1gd9w Před rokem

    Can we make draggable and change img array?

  • @sallu21m
    @sallu21m Před 9 měsíci

    How can I add caption under each image ?

  • @user-eo5qu9mb9c
    @user-eo5qu9mb9c Před 3 lety +1

    Bhai ji aapse hath jodkar guzarish hai🙏🏻 coding to clear dikhaya karo.....
    All ok

  • @meherunnesahossainibnath5958

    source code drive link not working...

  • @LightlyLilyAsmr
    @LightlyLilyAsmr Před rokem

    Is there a way to get the columns like this without using three dream divs? I have php code and I don’t know if I can make that work because the images are uploaded from a database so it isn’t linked in the php html. :-/
    I’ve been struggling with this for over a week actually, haha
    I’m able to get columns with some tweaking, but it leaves this large spacing between the images that doesn’t look smooth like the gallery in this video

  • @sonamtamang4154
    @sonamtamang4154 Před 2 lety

    you didnot say photo size!

  • @ziafathima2508
    @ziafathima2508 Před 3 lety

    i have some doubts umm i am using notepad to do your html but the second part its coming like text so what should i do and which app do you use to do this

    • @Tech2etc
      @Tech2etc  Před 3 lety

      Sry couldn't get your question.
      I used sublime text as a text editor.

    • @ziafathima2508
      @ziafathima2508 Před 3 lety

      @@Tech2etc umm no i meant was that where did u basically make this like type all the info and commands and all did u simply do in a normal notepad or you installed CSS and html

  • @faizanahemad6381
    @faizanahemad6381 Před 3 lety +1

    Brother, also design its admin panel and show it

  • @adieahmadfakhrudinsyah1135

    thanks bang

  • @bhaluu2017
    @bhaluu2017 Před rokem

    Source code open ni hora mere pas error ara hai file open ni hori

  • @ziafathima2508
    @ziafathima2508 Před 3 lety

    can u send the link to download this app how do we do it

  • @Argylleagen
    @Argylleagen Před 11 měsíci

    None of the links are working. Big disappointment 👎

  • @asphaltking5870
    @asphaltking5870 Před 2 lety

    thanksssssssssssssssssss

  • @kainatali5292
    @kainatali5292 Před rokem

    meri pictures to bht bari a ri

  • @user-yo5mg8yq4c
    @user-yo5mg8yq4c Před 11 měsíci

    image des na kere

  • @thechoosen4240
    @thechoosen4240 Před 2 lety

    Good job bro JESUS IS COMING SOON;PREPARE