“Sembunyikan Scrollbar di Tailwind CSS” Kode Jawaban

Sembunyikan Tailwind Scrolbar

/*
    https://github.com/tailwindlabs/tailwindcss/discussions/2394
    https://github.com/tailwindlabs/tailwindcss/pull/5732
*/
@layer utilities {
    /* Chrome, Safari and Opera */
    .no-scrollbar::-webkit-scrollbar {
      display: none;
    }

    .no-scrollbar {
      -ms-overflow-style: none; /* IE and Edge */
      scrollbar-width: none; /* Firefox */
    }
}

<div className="no-scrollbar overflow-y-auto">
Inquisitive Iguana

Sembunyikan Scrollbar di Tailwind CSS

# Using npm
npm install tailwind-scrollbar-hide

# Using Yarn
yarn add tailwind-scrollbar-hide

Then add the plugin to your tailwind.config.js file:

// tailwind.config.js
module.exports = {
  theme: {
    // ...
  },
  plugins: [
    require('tailwind-scrollbar-hide') // add this to your plugins
    // ...
  ]
}
How to use it !! 
Use in you template scrollbar-hide for visual hiding scrollbar

<div class="w-4 scrollbar-hide">...</div>


Or!!!  restore default value use scrollbar-default

<div class="w-4 scrollbar-hide md:scrollbar-default">...</div>
ABDELLATIF ANAFLOUS

Tidak ada tailwind scrollbar

/* Hide scrollbar for Chrome, Safari and Opera */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.no-scrollbar {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}
PriyavKaneriaUsesGrepper

Jawaban yang mirip dengan “Sembunyikan Scrollbar di Tailwind CSS”

Pertanyaan yang mirip dengan “Sembunyikan Scrollbar di Tailwind CSS”

Lebih banyak jawaban terkait untuk “Sembunyikan Scrollbar di Tailwind CSS” di CSS

Jelajahi jawaban kode populer menurut bahasa

Jelajahi bahasa kode lainnya