Search code examples
qtqt5qtstylesheetsqtabbar

How to have width of tabs change with text inside using width: auto; in QTabBar::tab in Qt5?


I have a QTabBar with several tab panes styled with the following:

QTabBar::tab {
    background: gray;
    color: white;
    width:auto;
    height:1em;
    border:0px;
    border-top-left-radius:8px;
    border-top-right-radius:8px;
}

QTabBar::tab:selected {
    background: lightgray;
    font-weight:bold;
    color:black;
}

This looks like so:

Tab text is cropped

You can clearly see that tab size is constant. There are no other styles that should affect this QTabBar except perhaps the custom font. There is no special code affecting it either.

To me this looks buggy. I would expect the width:auto to make the tabs grow in size to contain the text inside them. This is to save space, because with many tabs, having a fixed width will take a lot of space.

Further I have set a padding to see if this would give the text some more space like so:

padding: 1em;

The result looks like this:

Text still cropped even with padding

The text is cropped exactly the same, and the padding is added to the outside of the box.

I have tried all sorts of combinations of negative margins, borders and padding to no avail. Is this not possible in Qt?

I can fix the problem like so:

width: 7em;

But then all tabs are the same width, and I am forced to waste tons of screen-estate.

Any tips welcome. Thanks!


Solution

  • I discovered the solution to this.

    It was simple, and I felt embarrassed for not finding it sooner. But I guess this has some value for others, so I won't delete it.

    Simply omit the width: line altogether. Apparently width:auto is not the same as leaving it out in qss.