Home/ Questions/Q 6673887
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T03:40:52+00:00

The scroll bar can be seen in the side-panel when you click on a

  • 0

Side panel scrollbar

The scroll bar can be seen in the side-panel when you click on a tweet and the conversation linked to the tweet is long enough.

How is the scroll bar created and styled?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    They’re using ::-webkit-scrollbar and the associated pseudo-elements, which only work in WebKit browsers (which is fine, because this is just aesthetics).

    Take a look at this for more information: Apple-like scrollbars using CSS

    I’ve taken the CSS that Twitter is using, see: http://jsbin.com/ubasew

    #doc ::-webkit-scrollbar{width:9px;height:9px;}
#doc ::-webkit-scrollbar-button:start:decrement,#doc ::-webkit-scrollbar-button:end:increment{display:block;height:0;background-color:transparent;}
#doc ::-webkit-scrollbar-track-piece{background-color:#FAFAFA;-webkit-border-radius:0;-webkit-border-bottom-right-radius:8px;-webkit-border-bottom-left-radius:8px;}
#doc ::-webkit-scrollbar-thumb:vertical{height:50px;background-color:#999;-webkit-border-radius:8px;}
#doc ::-webkit-scrollbar-thumb:horizontal{width:50px;background-color:#999;-webkit-border-radius:8px;}

    The #doc is as Twitter had it, and it’s there so that only scrollbars inside #doc are customised.

    • 0