CSS GRID | #3 Columns & Rows

Поділитися
Вставка
  • Опубліковано 29 січ 2025

КОМЕНТАРІ • 95

  • @husainfikri7513
    @husainfikri7513 2 роки тому +6

    Timestamp:
    0:00 Teori
    4:13 Latihan 1 - Dasar Columns & Rows
    8:45 Latihan 2 - Explicit & Implicit Grid
    15:27 Latihan 3 - Auto Flows
    18:08 Latihan 4 - Grid Values
    19:07 Latihan 5 - Fraction

  • @FexIT156
    @FexIT156 2 місяці тому

    Mantap pak dika saya suka dengan penjelasn anda mudah dimengerti ga bosen semoga menjadi amal jariyah yg terus mengalir🙏

  • @juniordev4682
    @juniordev4682 2 роки тому +3

    Selalu memberikan pemahaman fundamental yang sangat mendetail. Semangat terus Pak Sandikha

  • @SuasanaSeram
    @SuasanaSeram 4 роки тому

    Terima kasih pak sandhika, berkat pak sandhika saya selalu belajar Pemograman dari jam 6 malam sampai jam 10 malam

  • @Unknown-hl1jd
    @Unknown-hl1jd 2 роки тому

    terimakasih pak dika atas ilmunya, saya cuma bisa bayar dengan tidak skip iklan.

  • @antonsantoso9775
    @antonsantoso9775 3 роки тому +1

    Matursuwun mas atas ilmunya yg diberikan .. Titik koma selalu diinget🙏🙏

  • @ra6160
    @ra6160 Рік тому

    sehat terus pak dika.. terimaksih atas ilmunya.. saya lebih cepet paham dg penjelasan pak dika daripada baca karna pak dika jelasin skenario2 nya lebih lengkap daripada yg tertulis di web

  • @anjingkontol520
    @anjingkontol520 4 роки тому +3

    Tetap support channel lu bg,apapun yg terjadi👌

  • @marcellino3561
    @marcellino3561 Рік тому +1

    penjelasannya mudah dipahami, mantap

  • @RianY2K
    @RianY2K 4 роки тому +1

    Wah mantap, terima kasih , saya sering lupa istilah istilah di css grid ini , terutama mulai dari 15:58

  • @regisalam5042
    @regisalam5042 4 роки тому +2

    Auto kilik ada notif 👌

  • @CHANNELGIVEWAY
    @CHANNELGIVEWAY 4 роки тому

    senang bange nontom video pak sandhika dengan kecepatan 1.75x dan terimakasih untuk ilmunya😎😎

  • @ahmadfauza5331
    @ahmadfauza5331 4 роки тому

    Ini yang di tunggu tunggu thanks ilmunya pak

  • @aakdennissrihard764
    @aakdennissrihard764 2 місяці тому

    Terimakasih pak atas pembelajarannya

  • @andifaizal6848
    @andifaizal6848 4 роки тому

    Materinya sangat memudahkan utk dipelajari.. semangat berbagi ilmu pak.. 🙌

  • @msdk8886
    @msdk8886 4 роки тому

    Baru lirik css grid gara-gara masalah sama drag n drop di cms. Mudah mudahan mempermudah overlap element yg bikin pusing 😁

  • @alfianizzah3394
    @alfianizzah3394 4 роки тому

    Terima kasih banyak pak.sangat ditunggu video selanjutnya😁😄

  • @rafi_45
    @rafi_45 4 роки тому +1

    gak sabar episode selanjutnya pak. thank you so much. :)

  • @dzalhaqi
    @dzalhaqi 4 роки тому

    Keren nih pak belajar makin semakin semangat karena ada modulnya jadi klo kelupaan bisa review lagi hehehe, terimakasih banyak pak

  • @botolkosong8844
    @botolkosong8844 4 роки тому

    Akhirnya nemu chanel mantap!

  • @codinghybrid1493
    @codinghybrid1493 4 роки тому

    Perfect.. tutorial thanks pak dhika

  • @IndraKuseuma
    @IndraKuseuma 4 роки тому

    Terima kasih bnyk pak, ditunggu video selanjutnya :)

  • @hendravideographer
    @hendravideographer 4 роки тому

    Firefox yang baru sudah bisa nampilin nama nya loh pa Dhika... heheheh e kereeeeen

  • @wisnuazis5131
    @wisnuazis5131 4 роки тому

    Gak sabar nunggu yang bagian subgrid :D

  • @budi-dev8814
    @budi-dev8814 3 роки тому

    Syukron pak

  • @saradaayu506
    @saradaayu506 4 роки тому

    Trimakasih pak dika...

  • @tonisopianjakpar1800
    @tonisopianjakpar1800 4 роки тому

    terima kasih pak dika, ilmunya

  • @white-t9922
    @white-t9922 Рік тому

    di microsoft edge juga udh ada grid inspect gitu, sm flexbox layout. lumayan make ms edge bisa dapet poin buat dituker voucher alfamart🤣

  • @dailykocak
    @dailykocak 4 роки тому

    mantap pak, pertamax

  • @raffasyaaryatama1372
    @raffasyaaryatama1372 3 роки тому

    sangat bermanfaat

  • @tiodwisatrio8638
    @tiodwisatrio8638 3 роки тому

    Terima Kasih banyak pak

  • @tauchcall5223
    @tauchcall5223 3 роки тому

    the best teacher

  • @mm-bo5mc
    @mm-bo5mc 4 роки тому

    Halo pak Sandhika, saya tunggu kelas "Backend PHP & Bootstrap". Terima kasih :))

  • @ShovenaFamily
    @ShovenaFamily 4 роки тому

    terima kasih pak dika.

  • @killuazoldiq575
    @killuazoldiq575 2 роки тому

    mantappp pak

  • @IfzGT
    @IfzGT 4 роки тому

    akhirnyaaa

  • @zorrobasher2947
    @zorrobasher2947 3 роки тому +1

    Thanks Pak :)

  • @ubachanel702
    @ubachanel702 4 роки тому

    Tks atas ilmunya kk

  • @mimahnurjanah8223
    @mimahnurjanah8223 4 роки тому +1

    Assalamualaikum pak nnti beljr membuat website dgn lengkap menggunakan CI donk pak.mmng di Chanel UA-cam lain sdh bnyk.tp saya mngti pemhsannya cmn dgn bpk.contohnya membuat pembuatan website perpustakaan yang lngkp gt pak

  • @quinlancer
    @quinlancer 4 роки тому

    Mantap Pak...

  • @RenalTutor
    @RenalTutor 4 роки тому +2

    sebenarnya bagusan mana sih pak ? bagus kita belajar lewat youtube atau baca documentation officialnya , atau lewat w3school ? kalau di youtube, kelebihannya ya bapak jelaskan dengan bagus dan baik, dan mudah dimengerti, dan menjelaskan berbagai kasus dalam pembuatan website, kelemahannya ya hanya pada waktu terlalu banyak dihabiskan.

    • @ra6160
      @ra6160 Рік тому

      ga ada cara belajar yg salah dan bener. aku biasanya nyampurin dari byk media dan sumber. Dan harus mau berkorban waktu juga untuk belajar. Aku sendiri ga masalah sih waktuku 20menit habis buat belajar lewat video spt ini, karna itu akan memangkas waktuku yg bisa kuhabiskan klo aku ga paham2 ketika belajar lewat dokumentasi/w3school misalnya. Intinya ya jalani yg menurut kita enak, jangan terlalu itungan dg waktu yg kita hbiskan untuk belajar, terutama klo cuma 20menit mah gada apa2nya

    • @RenalTutor
      @RenalTutor Рік тому

      @@ra6160 oke

  • @nabillaaaaa
    @nabillaaaaa 4 роки тому

    Terima kasih pak

  • @Aaabdulazid
    @Aaabdulazid 4 роки тому

    Nyimak pak

  • @Masduki8Masduki1
    @Masduki8Masduki1 13 днів тому

    Makasih bg

  • @abdanhafidz9302
    @abdanhafidz9302 4 роки тому

    Jelasin sinkronisasi pak di Next video

  • @kwonshyubill4041
    @kwonshyubill4041 4 роки тому

    Dosen quhhh

  • @muhammadaldipamungkas6231
    @muhammadaldipamungkas6231 4 роки тому +5

    Pak dika, gimana sih cara buat text mining dengan php, saya mau belajar tapi cukup kesulitan dalam mencari materinya. tolong di bantu siapa tau jadi konten baru bapak hehehe

  • @vernanda3238
    @vernanda3238 4 роки тому

    Buatin tutorial css media query pak

  • @amircahyadi9219
    @amircahyadi9219 4 роки тому

    super sekali

  • @fadhilmunifdermawan3718
    @fadhilmunifdermawan3718 4 роки тому

    mantap makasih pak!!

  • @hasanbasri-bs9su
    @hasanbasri-bs9su 2 роки тому

    Memang penjelasannya detail tpi butuh waktu untuk memahami ini karena memang susah untuk di pahami ... Butuh waktu memang ... Kalau flexbox cuma butuh waktu 2 3 hari buat memahami kalau CSS grid karena gabungan dari column dan rows jadi butuh pemahamana extra

  • @muhaecaldwikhatami7838
    @muhaecaldwikhatami7838 4 роки тому +1

    bahas codeigniter 4 dong pak :D

  • @brilybranco3756
    @brilybranco3756 4 роки тому

    Mantaappps bang !!

  • @makhdumrzl131
    @makhdumrzl131 4 роки тому +1

    First bang hehe

  • @hafizharnaufal9623
    @hafizharnaufal9623 4 роки тому

    pak dika, tolong buat tutorial Codeigniter 4 dong. strukturalnya kan sudah berubah nih pak. siapa tau bisa membantu teman2 yang lain, saya cari tutorial nya blm banyak pak hehehe

  • @crashbilly4929
    @crashbilly4929 2 роки тому

    Kang... Kalo pake flexbox ada fr ga kang?

  • @mochacinoo
    @mochacinoo 2 роки тому

    Kembali lagi nonton grid, karena terlalu nyaman belajar JS jadi lupa cara pake grid :v

  • @septach8680
    @septach8680 4 роки тому

    asslamualaikm wrwb pak dika.. saya terakhir ini belajar cara membuat URL SEO Friendly, tapi mash kurang menguasainya.. bisa gk pak, bikin tutorial pelajaran dan contoh membuat URL SEO Friendly..
    Terimkasih.. ditunggu pak :)

  • @zchellpy
    @zchellpy 2 роки тому

    Pak dosen ijin bertanya pak, kalau kita mau pelajari tentang properti atau referensi properti dari css display yang lain seperti block, inline dan table ada petunjuk pak..?

  • @dapaaaa2236
    @dapaaaa2236 3 роки тому

    GG

  • @86geovanni
    @86geovanni 4 роки тому

    pak dika maaf mau tanya, kenapa grid-template-columns saya di css warnanya putih (tidak terbaca) ?

  • @junaedimarojahangultom470
    @junaedimarojahangultom470 2 роки тому

    saya nyoba di chrome tahun ini 2022 udh ada view gridnya sama persis, cuman ngk bisa liat garis explisit dan implisit gridnya, jadi tetep harus coba di firefox biar keliatan. -just info

  • @rianhilman2942
    @rianhilman2942 4 роки тому

    Auto nonton hehe

  • @hidayatuddinamatirantv3209
    @hidayatuddinamatirantv3209 4 роки тому +1

    Habis playlist css grid ajarin ci4 pa dika yah..

  • @NGOMONGIN-FILM
    @NGOMONGIN-FILM 4 роки тому

    Bang gimana cara buat website market place dan di kaitka ke aplikasi tolong bang

  • @ucupchannel9224
    @ucupchannel9224 3 роки тому

    Pak mau tanya kok saya tidak timbul warna merah nya yah??
    Saya menulis seperti bapak.. apakah ada yg salah pak?? Tolong di koreksi
    .item : nth-child (even) {
    background-color: rgb(255, 142, 142);
    }

  • @kupam6892
    @kupam6892 4 роки тому

    bang cara buka mendapatkan username sama pass di shapshoter gimana ya

  • @aripraynan7673
    @aripraynan7673 4 роки тому

    Assalamualaikum pak dika,bisa gak buat video tentang admin dasbord WEB kayak blogspot pak biar ngerubah text website gak perlu ngopreck HTMLnya.
    Smoga berkenan dibales comment saya.

  • @naftaragaassestu5260
    @naftaragaassestu5260 4 роки тому

    Pak dika, saya mau tanya pak, kalau di bootstrap belajar gridnya lebih simpel, kenapa harus mempelajari CSS Grid yang ini pak? Soalnya saya perhatikan ini lebih rumit

    • @syairdafiqfaizurrahman5253
      @syairdafiqfaizurrahman5253 4 роки тому

      menurut saya jika menggunakan bootstrap,untuk membuat baris baru ,harus membuat class row dulu,kalau menggunakan css grid tinggal ditambahin aja item barunya di dalam container ,akan otomatis ngebuat baris baru.

    • @robbyawaldi6824
      @robbyawaldi6824 4 роки тому

      kalau udah paham malah css grid lebih mudah diimplementasiin dibanyak case, dan dari struktur html menjadi lebih singkat

  • @erlanggarizky4216
    @erlanggarizky4216 4 роки тому

    Erlangga_Hadir

  • @AhmadAnwar31Aan
    @AhmadAnwar31Aan 4 роки тому

    bagaimana membuat tampilan full screen pada grid pak ?, soalnya seperti ada margin dipinggir.

    • @nekozu_
      @nekozu_ 4 роки тому +1

      Html sama body nya kasih properti css, margin sama padding nilai nya 0

  • @andhikansinaba7478
    @andhikansinaba7478 4 роки тому

    Assalamualaikum, mas sandhika... Punya saran gak laptop khusus programmer yang budjetnya 6-7 jutaan? Terimakasih

    • @ElwinMusadi
      @ElwinMusadi 4 роки тому

      cari di channel-nya jagat review gan

  • @ripiuuuawamm3667
    @ripiuuuawamm3667 4 роки тому

    Pak dosen saya kok bru smpai css dah mumet kpala bnyak materi yg di lwati lupa kmbali

  • @gustiranda5806
    @gustiranda5806 4 роки тому

    Pak bagusan pake bootstrap atau CCS grid ?

    • @adeyusuf9641
      @adeyusuf9641 4 роки тому

      Bootstrap juga pasti dibangun dari CSS Grid, bedanya kalo bootstrap itu framework yang kita "tinggal make" Dan manggil class nya Aja, kalo CSS Grid kita yang bikin manual.

  • @marcodev3375
    @marcodev3375 4 роки тому

    Bang kalau bikin grid sistem seperti gallery di Pinterest, dibagi 2 colom (atau 4 colom di desktop), image nya dari kiri ke kanan > terus turun baris berikutnya, tapi "tinggi image nya beda-beda". Gmn solusi CSS nya?

    • @ra6160
      @ra6160 Рік тому

      itu keknya pakai flexbox juga bisa mas

  • @damsikcode04
    @damsikcode04 2 роки тому

    8:40

  • @muhamadibnuroushul5229
    @muhamadibnuroushul5229 4 роки тому

    #ask kurang mengerti di menit 17:35 ?

    • @muhammadsyukurabadi3000
      @muhammadsyukurabadi3000 4 роки тому

      Menurut saya, karena grid-template-rows didefinisikan secara eksplisit untuk dua baris, jadi tiap dua cell (dua nomor) akan pindah ke bawah. Seperti pada video, cell nomor 1 dan nomor 2 akan saling tindih. Begitu juga jika grid-template rows didefinisikan secara eksplisit untuk tiga baris - tiap tiga cell akan membentuk satu buah kolom. CMIIW

  • @ElwinMusadi
    @ElwinMusadi 4 роки тому +3

    css grid lebih bikin pusing drpda flexbox 😅

    • @rikikrismawan1831
      @rikikrismawan1831 4 роки тому

      haha. Flexbox cuma ngurus column atau baris. grid dua duanya sekaligus 😅

  • @hibram9038
    @hibram9038 4 роки тому

    jawaban video berikutnya => repeat(9, 1fr);

  • @soni5608
    @soni5608 4 роки тому

    Kenapa kita belajar web programming? Jika CMS untuk membuat web sudah disediakan dan tinggal drag n drop

  • @maryadimasyuhur87
    @maryadimasyuhur87 Рік тому

    ASK:
    bagaimana cara buat tampilan menggunakan grid dengan tampilan
    column sebanyak 2 dan auto row (tergantung data) akan tetapi yang di fill duluan adalah column pertama dulu,, sampai setengah-nya,, lalu setelahnya ke column berikutnya
    misalakan banyak data ada 9 buah
    1 6
    2 7
    3 8
    4 9
    5
    terima kasih 🙏

    • @gwr_gura
      @gwr_gura 3 місяці тому

      izin menjawab
      1
      2
      3
      4
      5
      6
      7
      8
      9
      .container {
      width: 600px;
      margin: 50px auto;
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: repeat(5, 1fr);
      grid-auto-flow: column;
      }
      .item {
      background: salmon;
      display: flex;
      justify-content: center;
      align-items: center;
      }
      .item:nth-child(even) {
      background: lightblue;
      }

  • @aksaa235
    @aksaa235 3 роки тому

    Terimakasih pak