Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

My Question is: HOW TO GET RID OF THAT OBSOLETE LINE using my stylesheet.

The black frame (objectname= mainTabBarWidget(QWidget)) is laid out vertically. It has a Fixed height (38px) and contains these elements from left to right: QToolButton, QTabBar, QToolButton, and another QToolButton.

Its stylesheet is the following:

QWidget#mainTabBarWidget {
    border-bottom: 1px solid black;
    background-color: rgb(107, 102, 102);
The "+" QToolButton creates a new Tab whenever its clicked. The QTabBar (called tabBar) has this stylesheet:
QTabBar#tabBar{
    left: 10px; /* move to the right by 5px */
    border-bottom: none;
QTabBar::tab {
    background-color: rgb(194, 180, 180);
    border-top: 2px solid rgb(107, 102, 102);
    border-left: 2px solid rgb(107, 102, 102);
    border-right: 2px solid rgb(107, 102, 102);
    border-bottom: none;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: -8px;
    border-bottom-right-radius: -8px;
    min-width: 100px;
    max-width: 100px;
    height: 35px;
    padding: 2px;
QTabBar::tab:hover {
    background-color: rgb(216, 209, 209);
QTabBar::tab:selected {
    background-color: rgb(243, 231, 231);
    border-color: rgb(0, 0, 0);
QTabBar::scroller { /* the width of the scroll buttons */
     border: none;
    width: 20px;
    background-color: rgba(0,0,0,55);
QTabBar::tear {
    border: none;
    background-color: rgba(222,221,15, 45);
   width: 0px;
QTabBar::tab:disabled {
    border: none;
P.S.1. When 3 or 4 tabs are added, the line disappears too.
P.S.2. I tried setting the tab width to 120px and the line disappeared, but when I add other tabs and the scroll buttons show up, this line re-appears.
                I have some application to test style sheet, but I was not able to reproduce this problem (I've copied-pasted your style sheet).
– Marek R
                Feb 16, 2015 at 22:23
                @MarekR: I figured out the cause of that strange line, but I don't know how to remove it. In fact, in my constructor I set ui->tabBar->setUsesScrollBars(false); and all that space disappeared (the line too). But now my QTabBar doesn't support Scrollers :/
– Fethi Dilmi
                Feb 16, 2015 at 23:35
I had a similar problem, but it was solved below.
http://doc.qt.io/qt-5/qtabbar.html#drawBase-prop  
QTabBar::setDrawBase(false);
QTabBar has a QT property called drawBase, any QT property can be set in a stylesheet by prepending the property name with qproperty- . So, this fixed the problem for me.
QTabBar
    qproperty-drawBase: false;
        
Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.