Join us and the lead editor of IRL, Mozilla's multi-award-winning podcast, for a behind-the-scenes look at the pod and to contribute your ideas for the next season, themed: "AI and ME." Mark your calendar and join our Community Call on Wednesday, Aug 7, 17:00–17:45 UTC. See you there!

ابحث في الدعم

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Alternate for -webkit-scrollbar-thumb, -webkit-scrollbar-track and -webkit-scrollbar which is working fine in chrome and safari

  • 2 (ردّان اثنان)
  • 14 have this problem
  • 1 view
  • آخر ردّ كتبه logeshprabu

more options

Here is my code,

li.event_list_cnt::-webkit-scrollbar {
width: 6px;
}

::-webkit-scrollbar-track {
background: url('/mma/sites/all/images/home/scroll-bg.png')no-repeat;
    background-position:center;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

li.event_list_cnt::-webkit-scrollbar-thumb {
border-radius: 10px;
background: url('/mma/sites/all/images/home/scroll.gif')no-repeat;
background-position:top center;     
}
Here is my code, <pre><nowiki>li.event_list_cnt::-webkit-scrollbar { width: 6px; } ::-webkit-scrollbar-track { background: url('/mma/sites/all/images/home/scroll-bg.png')no-repeat; background-position:center; -webkit-border-radius: 10px; border-radius: 10px; } li.event_list_cnt::-webkit-scrollbar-thumb { border-radius: 10px; background: url('/mma/sites/all/images/home/scroll.gif')no-repeat; background-position:top center; }</nowiki></pre>

Modified by cor-el

الحل المُختار

You can't style scroll bars on web pages. Only extensions can do this.

Note that you are inconsistent:
One one place (track) you use -webkit-border-radius: 10px; and border-radius: 10px; and on the other (thumb) only border-radius: 10px;


A good place to ask advice about web development is at the MozillaZine "Web Development/Standards Evangelism" forum.

The helpers at that forum are more knowledgeable about web development issues.
You need to register at the MozillaZine forum site in order to post at that forum.

Read this answer in context 👍 0

All Replies (2)

more options

الحل المُختار

You can't style scroll bars on web pages. Only extensions can do this.

Note that you are inconsistent:
One one place (track) you use -webkit-border-radius: 10px; and border-radius: 10px; and on the other (thumb) only border-radius: 10px;


A good place to ask advice about web development is at the MozillaZine "Web Development/Standards Evangelism" forum.

The helpers at that forum are more knowledgeable about web development issues.
You need to register at the MozillaZine forum site in order to post at that forum.

more options

Thanks cor-el, i forward it to mozillazine and awaiting for reply.