Search code examples
c++cssqtstylesheet

Stylesheet on QScrollBar leaves background of scrollbar with checkerboard pattern?


When I style my QScrollBar using a stylesheet, the background color is checkered instead of being solid.

QScrollBar:horizontal {
    background-color: grey;
}

enter image description here

How do you make the background of the scrollbar a solid color?


Solution

  • What you are referring to as "the background" is actually the two sub-elements add-page and sub-page. You need to define the background element on those sub-elements.

    The simplest solution would be to remove the background on both. Then it would inherit the background color grey that you have already set on QScrollBar:

    QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal {
        background: none;
    }
    

    enter image description here

    But if desired, you could style each individually to your liking:

    QScrollBar::sub-page:horizontal {
        background: red;
    }
    
    QScrollBar::add-page:horizontal {
        background: green;
    }
    

    enter image description here

    Source.

    Unfortunately, this solution is rather hard to divine from the official documentation.