Qt CSS - Small white space on bottom of QScrollBar

[RenegadeVile]

Greetings everyone,

I have a minor aesthetic problem with Qt at this moment. I am currently customizing the look of the QScrollBars in my application and have noticed a graphical oddity. Lacking a decent way of describing it, searches have lead me nowhere and I've attempted numerous stylesheet related fixes. I will post an enlarged screencap below.

http://postimg.org/image/o3gl78gf1/

The red box on the bottom indicates the white space I am talking about. It is located just under the downward arrow (which I colored that horrible magenta for clarity's sake).

Any suggestions on what may be causing this and/or how to fix it? It is easier to spot than one might think because it cuts off the border of the QScrollArea.

I will post any relevant CSS code below as well:

@QScrollBar:vertical {
background-color: $orval-light-gray4$;
width: 20px;
border-style: none;
margin: 20px 0 20px 0;
padding: 0px;
}

QScrollBar::handle:vertical {
background-color: $orval-light-gray2$;
width: 20px;
min-height: 10px;
border-style: none;
}

QScrollBar::handle:vertical:pressed {
/background-color: $orval-medium-gray3$;/
background-color: $orval-yellow$;
}

QScrollBar::add-line:vertical {
background-color: #FF00FF;/$orval-light-gray4$;/
width: 20px;
height: 20px;
border-style: none;
subcontrol-position: bottom;
subcontrol-origin: margin;
}

QScrollBar::add-line:vertical:pressed {
background-color: $orval-yellow$;
}

QScrollBar::sub-line:vertical {
background-color: $orval-light-gray4$;
width: 20px;
height: 20px;
border-style: none;
subcontrol-position: top;
subcontrol-origin: margin;
}

QScrollBar::sub-line:vertical:pressed {
background-color: $orval-yellow$;
}

QScrollBar::up-arrow:vertical {
border-image: url(:/Orval/Resources/arrowup.png);
width: 20px;
height: 20px;
}

QScrollBar::down-arrow:vertical {
border-image: url(:/Orval/Resources/arrowdown.png);
width: 20px;
height: 20px;
}

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

QDialog#coreTermsAndConditionsDialog QScrollArea {
border-style: solid;
border-color: $orval-medium-gray3$;
border-width: 1px;
padding-left: 2px;
padding-bottom: 2px;
}@

Thank you in advance for any and all help.

[PaSt]

Got exactly the same problem, it's freaking me out!

Doesn't anybody have an idea?

[must40]

Hello,
I know it's quite old post but might be usefull for someone in the future,
also that's my first post so hello everyone : )

You need to define stylesheet for both scrollbars, even when you don't use horizontal scrollbar.
Then border will be completed for vertical scrollbar at the bottom.

[must40]

Hello,
I know it's quite old post but might be usefull for someone in the future,
also that's my first post so hello everyone : )

You need to define stylesheet for both scrollbars, even when you don't use horizontal scrollbar.
Then border will be completed for vertical scrollbar at the bottom.

[muffins]

This is pretty old but in case anyone is still looking for the answer, it's the QAbstractScrollArea::corner you're looking for. Add this to your style sheet and the area under the scrollbar's add-line control will disappear:

QAbstractScrollArea::corner {
    background: none;
    border: none;
}