0

I want to view WhatsApp web in a narrow window next to my other windows. Therefore I want to shrink or toggle the contacts sidebar.

2
  1. Download Stylus (for Chrome or Firefox)
  2. Click Stylus icon from the toolbar, click "Manage"
  3. Click "Write new style", click "Import"
  4. Copy the text below to text box:

    @-moz-document domain("web.whatsapp.com") {
      .k1feT {
        flex-basis: 80px !important;    
      }
    }
    
  5. Click "Overwrite Style"
  6. Enter a name for your style (e.g. "Whatsapp")
  7. Click "Save", refresh Whatsapp Web page.

collapsed

1
  • This gave me the right idea. I changed the css a bit:.k1feT { flex: 0 0 30% !important; } ._1Iexl { flex: 0 0 70% !important; } ._3dqpi { min-width: 0px !important; }. Now I have a responsive WhatsApp Web that I can view on a small screen. – Benjamin Ziepert Jul 27 '18 at 8:25
0

Had to change the css again:

._2NwAr {
    flex: 0 80px !important;
}
._1eNef {
    display: none;
}
._2Evw0 {
    padding-left: 0px !important;
}
.VOr2j {
    margin-left: -30px !important;
}

enter image description here

2
  • Or if you want to see your burger menu and the "new chat" button ._2NwAr { flex: 0 80px !important; }; ._3nLE_ { left: -30px; overflow: unset; }; html[dir] ._2wfYK { padding: 0px; }; ._2Evw0 { padding-left: 0px !important; }; .VOr2j { margin-left: -30px !important; }; – Tobias Dec 11 '20 at 9:57
  • 1
    the CSS will keep changing, dont believe this will be a definitive answer – Sathyajith Bhat Dec 14 '20 at 21:46

Not the answer you're looking for? Browse other questions tagged or ask your own question.