skip to Main Content

I’m having problems testing tailwindcss in DevTools, when i try to uncheck or unselect display: flex it will uncheck ALL display flexes from everywhere, as you can see i have chosen a div which has display flex and background color, when i uncheck that display flex it will uncheck all display flexes if there are any BUT if i uncheck that background color it will only affect on that div because i dont have background color elsewhere. I dont have that problem with normal css, am i doing something wrong ?

enter image description here

one workaround is if i delete it from here:

enter image description here

2

Answers


  1. Disabling display: flex; that is inside the .flex class will disable the flex display for all elements that use the .flex class.

    My suggestion is to remove the flex class from the element using JavaScript.

    Alternatively, you can remove it using DevTools to debug the issue by modifying the HTML.

    Exemple code:

    const element = document.querySelector('#element-id');
    element.classList.remove('flex');
    
    Login or Signup to reply.
  2. You can use the .cls and toggle the classes at will.

    https://developer.chrome.com/docs/devtools/css/#classes

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search