QTabWidget stylesheet: white top border



  • Hi,

    Im customizing a QTabWidget with a "dark stylesheet". However, Im can't hide the white top border as shown in the following screenshot:
    !http://s4.postimg.org/anr0pavtp/qtabwidget_border.png!

    This is the stylesheet Im using:
    @
    QTabWidget {
    border: 0;
    }

    QTabWidget::pane {
    border-top: 1px solid #444;
    position: absolute;
    }

    QTabBar {
    background: #222;
    color: #666;
    border-radius: 0;
    border: 2px solid #222;
    }

    QTabBar::tab:top {
    margin: 1px 1px 0 0;
    padding: 4px 8px;
    border-bottom: 3px solid transparent;
    }

    QTabBar::tab:selected {
    color: white;
    border: 0;
    }

    QTabBar::tab:top:hover {
    border-bottom: 3px solid #444;
    }
    QTabBar::tab:top:selected {
    border-bottom: 3px solid #1086e2;
    }

    QTabBar::tab:hover,
    QTabBar::tab:focus {

    }
    @

    What am I missing?



  • Any ideas?
    I basically tried to set "border = 0" everywhere but the (annoying) white line is still present.


  • Moderators

    The above stylesheet doesn't show the line for me. Is this exactly how you have it?
    It doesn't look like border issue to me. It's like the selected tab is 1px higher or all other are 1px shorter. Do you have any other style that could modify height, margins or padding of the selected tab?



  • Thanks for the feedback. Thats probably because all the other widgets are using the default style so its hard to notice the white line, please try with Fusion:

    @qApp->setStyle(QStyleFactory::create("Fusion"));@

    and then apply this stylesheet:

    https://gist.github.com/QuantumCD/6245215

    Now you should see the white line between the toolbar and the QTabWidget. Let me know if you don't.

    edit: other than Fusion "dark theme" I haven't any other stylesheets being used


  • Moderators

    Nope. It still looks ok. The only gray (not white) line I got is the border of the toolbar.
    This is what I got (with toolbar on top and moved to the side):
    !http://i296.photobucket.com/albums/mm188/crossblades666/image1.png(fusion with toolbar on top)!

    !http://i296.photobucket.com/albums/mm188/crossblades666/image2.png(fusion with toolbar on the side)!



  • Thanks again for your feedback.
    Finally I found that using setDocumentMode(true) is what is causing that white line to be drawn. At the same time it fills the tab area along the widget's width, which is something I like, so Im still trying to find a way to remove that white line and use setDocumentMode(true) at the same time.

    Maybe is it a Qt bug? Or is there a way to hide it through stylesheets or a QPalette?

    Any suggestion is very welcomed.


  • Moderators

    Ah, this seems to be a part of the frame of the document.
    You can match the color to the background by setting QPalette::Light in your palette. Note though that it will affect all the "3d" frames, so check if it's a problem for you. Easiest way is to set it red and see what screams at you. If it is a problem then you can selectively set this modified palette only for tab widgets.


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.