Congratulations to our 2022 Qt Champions!

QTabWidget TabBar font size weirdness

  • Hi

    I currently struggle with the creation of an QTabWidget with customized QTabBar 's. I want the tabbars with black background, white text color, self-adjust in width (which I normally expected as standard behaviour...) and selected tabbar font size 12pt and the non-selected font size 22pt.

    I derived my main class from QTabWidget and created a simple
    MainWindow class. Then I applied three stylesheets to the tabbar to fulfil
    my desired look.
    The problem is each stylesheet seems to disable its previous stylesheet.
    In my code the last stylesheet that decreases the font size for the selected tab disables the the 22pt font for the unselected tab and the background colors. So if I run my code I get this window:


    As you can see, no colors were applied, the "GOD" tab is selected and has the desired 8pt font size, but the unselected seems to have the applications standart font size and not the huge 22pt I wanted.

    If I comment out the last two stylesheets I get my desired colors:


    If I comment out only the last stylesheet I get my desired unselected huge font size but color fails AND it doesnt scale the tabs width with the huge text.



    #ifndef MAINWINDOW_H
    #define MAINWINDOW_H
    #include <QTableWidget>
    class MainWindow : public QTabWidget
        explicit MainWindow(QTabWidget *parent = 0);
    #endif // MAINWINDOW_H


    #include "mainwindow.h"
    MainWindow::MainWindow(QTabWidget *parent)
        QWidget *tab1 = new QWidget;
        QWidget *tab2 = new QWidget;
        this->tabBar()->setStyleSheet("QTabBar {background: #000000; color:#ffffff}");
        this->tabBar()->setStyleSheet("QTabBar::tab:!selected {font-size:22pt;}");
        this->tabBar()->setStyleSheet("QTabBar::tab:selected {font-size:8pt;}");


    #include <QApplication>
    #include "mainwindow.h"
    int main(int argc, char **argv)
        QApplication app(argc, argv);
        MainWindow mainWindow;;
        return app.exec();

    What am I doing wrong?

  • #pauledd,

    QString tabStyle = "QTabBar {background-color: #000000; color:#ffffff;}"
                       "QTabBar::tab:!selected {height: 50px; width: 100px;background-color: #000000; color:#ffffff;font-size:12pt;}"
                       "QTabBar::tab:selected {height: 50px; width: 100px;background-color: #000000; color:#ffffff;font-size:8pt;}";

  • Thank you! I see you specified height and width manually. That works so far. I will use that.