Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt
  • Unsolved
Collapse
qtws26_logo

The Qt Event of the Year: Qt World Summit 2026

Save Your Spot >
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. Horizontal text in QTabWidget
Qt 6.12 LTS is out! See what's new in the release blog

Horizontal text in QTabWidget

Scheduled Pinned Locked Moved Solved General and Desktop
25 Posts 8 Posters 30.1k Views 3 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • M MostafaEzzat

    @mrjj

    Thanks alot

    mrjjM Offline
    mrjjM Offline
    mrjj
    Lifetime Qt Champion
    wrote on last edited by
    #11

    @MostafaEzzat
    Np, that info was actually missing in the org example.

    M 1 Reply Last reply
    0
    • mrjjM mrjj

      @MostafaEzzat
      Np, that info was actually missing in the org example.

      M Offline
      M Offline
      MostafaEzzat
      wrote on last edited by MostafaEzzat
      #12

      @mrjj

      I'm sorry for opening this again but i've bunch of css code and want to use but when i add it from StyleSheet of Qt Designer The tabs became Vertical

      QTabWidget::pane { border: 1px solid lightgray; top:-1px; background: rgb(245, 245, 245);; }
       QTabBar::tab { background: rgb(230, 230, 230); border: 1px solid lightgray; padding: 15px; } 
      QTabBar::tab:selected { background: rgb(245, 245, 245); margin-bottom: -1px; }
      

      aqrt.PNG

      1 Reply Last reply
      0
      • mrjjM mrjj

        Hi
        You have to set
        alt text

        then it works for a plain TabWidget

        alt text

        S Offline
        S Offline
        sandrayin
        wrote on last edited by
        #13

        @mrjj

        Hi,

        i've managed to implement this but the close button does not align with the new style. What do I do?

        bf47f75d-b1b2-49bc-aab2-fe2bde67de6e-image.png

        jsulmJ 1 Reply Last reply
        0
        • S sandrayin

          @mrjj

          Hi,

          i've managed to implement this but the close button does not align with the new style. What do I do?

          bf47f75d-b1b2-49bc-aab2-fe2bde67de6e-image.png

          jsulmJ Offline
          jsulmJ Offline
          jsulm
          Lifetime Qt Champion
          wrote on last edited by
          #14

          @sandrayin said in Horizontal text in QTabWidget:

          What do I do?

          We don't know because you do not show any code...

          https://forum.qt.io/topic/113070/qt-code-of-conduct

          1 Reply Last reply
          0
          • A Offline
            A Offline
            AZEDINE
            wrote on last edited by
            #15

            I am trying to put the tab text in horizontal. I put the tabs in west orientation but the text appears in vertical like this picture:

            en python : class HorizontalTabStyle(QProxyStyle):
            def drawControl(self, element, option, painter, widget=None):
            if element == QProxyStyle.CE_TabBarTab:
            opt_tab = QStyleOptionTab(option)
            # نجعل Qt يرسم النص كما لو كان في الأعلى (North) وبالتالي يكون أفقي
            opt_tab.shape = QTabBar.RoundedNorth
            super(HorizontalTabStyle, self).drawControl(element, opt_tab, painter, widget)
            else:
            super(HorizontalTabStyle, self).drawControl(element, option, painter, widget)
            .....
            self.tabWidgetResult.setTabPosition(QTabWidget.TabPosition.West)

                # نطبّق الستايل المخصص على الـ tabBar
                self.custom_style = HorizontalTabStyle(self.tabWidgetResult.style())
                self.tabWidgetResult.tabBar().setStyle( self.custom_style)
            
            jsulmJ 1 Reply Last reply
            0
            • A AZEDINE

              I am trying to put the tab text in horizontal. I put the tabs in west orientation but the text appears in vertical like this picture:

              en python : class HorizontalTabStyle(QProxyStyle):
              def drawControl(self, element, option, painter, widget=None):
              if element == QProxyStyle.CE_TabBarTab:
              opt_tab = QStyleOptionTab(option)
              # نجعل Qt يرسم النص كما لو كان في الأعلى (North) وبالتالي يكون أفقي
              opt_tab.shape = QTabBar.RoundedNorth
              super(HorizontalTabStyle, self).drawControl(element, opt_tab, painter, widget)
              else:
              super(HorizontalTabStyle, self).drawControl(element, option, painter, widget)
              .....
              self.tabWidgetResult.setTabPosition(QTabWidget.TabPosition.West)

                  # نطبّق الستايل المخصص على الـ tabBar
                  self.custom_style = HorizontalTabStyle(self.tabWidgetResult.style())
                  self.tabWidgetResult.tabBar().setStyle( self.custom_style)
              
              jsulmJ Offline
              jsulmJ Offline
              jsulm
              Lifetime Qt Champion
              wrote on last edited by
              #16

              @AZEDINE There is no picture. And please format your code properly.

              https://forum.qt.io/topic/113070/qt-code-of-conduct

              A 1 Reply Last reply
              0
              • jsulmJ jsulm

                @AZEDINE There is no picture. And please format your code properly.

                A Offline
                A Offline
                AZEDINE
                wrote on last edited by AZEDINE
                #17

                @jsulm

                
                self.tabWidgetResult = self.findChild(QTabWidget, "tabWidgetResult")
                       if self.tabWidgetResult:
                           self.tabWidgetResult.tabBar().setCursor(Qt.CursorShape.PointingHandCursor)
                
                
                       self.tabWidgetResult.setStyleSheet("
                           QTabBar::tab {
                               width: 29px;
                               max-width: 100px;
                               min-width: 20px;
                           }
                
                           QTabBar::tab:selected {
                               background: #0E94A0;
                               color: white; 
                           }
                
                           QTabBar::tab {
                               color: #000000; 
                           }
                
                           QTabBar::tab::!selected {
                               color: #0E94A0; 
                           }
                
                           QTabBar::tab {
                               font-size: 14px;
                               font-weight: bold; 
                               margin: 5px; 
                               padding: 5px; 
                               border: 2px solid #0E94A0;
                               border-radius: 10px; 
                           }
                
                           QTabBar::tab > QLabel {
                               qproperty-alignment: AlignCenter; 
                           transform: translate(0,10px) rotate(-90deg);
                                   
                           }
                
                           QTabBar::tab:selected > QLabel {
                               qproperty-alignment: AlignCenter; 
                               transform: translate(0,10px) rotate(-90deg);
                               
                           }
                
                       ")
                       
                

                (Capture d'écran 2025-03-17 152926.png link url)) I am trying to put the tab text in horizontal. I put the tabs in west orientation but the text appears in vertical like this picture:

                jsulmJ A 2 Replies Last reply
                0
                • A AZEDINE

                  @jsulm

                  
                  self.tabWidgetResult = self.findChild(QTabWidget, "tabWidgetResult")
                         if self.tabWidgetResult:
                             self.tabWidgetResult.tabBar().setCursor(Qt.CursorShape.PointingHandCursor)
                  
                  
                         self.tabWidgetResult.setStyleSheet("
                             QTabBar::tab {
                                 width: 29px;
                                 max-width: 100px;
                                 min-width: 20px;
                             }
                  
                             QTabBar::tab:selected {
                                 background: #0E94A0;
                                 color: white; 
                             }
                  
                             QTabBar::tab {
                                 color: #000000; 
                             }
                  
                             QTabBar::tab::!selected {
                                 color: #0E94A0; 
                             }
                  
                             QTabBar::tab {
                                 font-size: 14px;
                                 font-weight: bold; 
                                 margin: 5px; 
                                 padding: 5px; 
                                 border: 2px solid #0E94A0;
                                 border-radius: 10px; 
                             }
                  
                             QTabBar::tab > QLabel {
                                 qproperty-alignment: AlignCenter; 
                             transform: translate(0,10px) rotate(-90deg);
                                     
                             }
                  
                             QTabBar::tab:selected > QLabel {
                                 qproperty-alignment: AlignCenter; 
                                 transform: translate(0,10px) rotate(-90deg);
                                 
                             }
                  
                         ")
                         
                  

                  (Capture d'écran 2025-03-17 152926.png link url)) I am trying to put the tab text in horizontal. I put the tabs in west orientation but the text appears in vertical like this picture:

                  jsulmJ Offline
                  jsulmJ Offline
                  jsulm
                  Lifetime Qt Champion
                  wrote on last edited by
                  #18

                  @AZEDINE said in Horizontal text in QTabWidget:

                  I put the tabs in west orientation

                  According to the picture you don't: the tabs are arranged vertically. How did you set up the QTabWidget?

                  https://forum.qt.io/topic/113070/qt-code-of-conduct

                  1 Reply Last reply
                  0
                  • A AZEDINE

                    @jsulm

                    
                    self.tabWidgetResult = self.findChild(QTabWidget, "tabWidgetResult")
                           if self.tabWidgetResult:
                               self.tabWidgetResult.tabBar().setCursor(Qt.CursorShape.PointingHandCursor)
                    
                    
                           self.tabWidgetResult.setStyleSheet("
                               QTabBar::tab {
                                   width: 29px;
                                   max-width: 100px;
                                   min-width: 20px;
                               }
                    
                               QTabBar::tab:selected {
                                   background: #0E94A0;
                                   color: white; 
                               }
                    
                               QTabBar::tab {
                                   color: #000000; 
                               }
                    
                               QTabBar::tab::!selected {
                                   color: #0E94A0; 
                               }
                    
                               QTabBar::tab {
                                   font-size: 14px;
                                   font-weight: bold; 
                                   margin: 5px; 
                                   padding: 5px; 
                                   border: 2px solid #0E94A0;
                                   border-radius: 10px; 
                               }
                    
                               QTabBar::tab > QLabel {
                                   qproperty-alignment: AlignCenter; 
                               transform: translate(0,10px) rotate(-90deg);
                                       
                               }
                    
                               QTabBar::tab:selected > QLabel {
                                   qproperty-alignment: AlignCenter; 
                                   transform: translate(0,10px) rotate(-90deg);
                                   
                               }
                    
                           ")
                           
                    

                    (Capture d'écran 2025-03-17 152926.png link url)) I am trying to put the tab text in horizontal. I put the tabs in west orientation but the text appears in vertical like this picture:

                    A Offline
                    A Offline
                    AZEDINE
                    wrote on last edited by
                    #19

                    @AZEDINE I am trying to put the tab text in horizontal. I put the tabs in west orientation but the text appears in vertical like this picture:

                     self.tabWidgetResult.setTabPosition(QTabWidget.West)
                    
                    1 Reply Last reply
                    0
                    • A Offline
                      A Offline
                      AZEDINE
                      wrote on last edited by
                      #20

                      image.png mon besoin comme ca en python

                      jsulmJ 1 Reply Last reply
                      0
                      • A AZEDINE

                        image.png mon besoin comme ca en python

                        jsulmJ Offline
                        jsulmJ Offline
                        jsulm
                        Lifetime Qt Champion
                        wrote on last edited by
                        #21

                        @AZEDINE Did you try what @mrjj suggested in this thread?

                        https://forum.qt.io/topic/113070/qt-code-of-conduct

                        A 1 Reply Last reply
                        0
                        • jsulmJ jsulm

                          @AZEDINE Did you try what @mrjj suggested in this thread?

                          A Offline
                          A Offline
                          AZEDINE
                          wrote on last edited by
                          #22

                          @jsulm moi utilise python est ce que il ya une solition ???

                          jsulmJ 1 Reply Last reply
                          0
                          • A AZEDINE

                            @jsulm moi utilise python est ce que il ya une solition ???

                            jsulmJ Offline
                            jsulmJ Offline
                            jsulm
                            Lifetime Qt Champion
                            wrote on last edited by
                            #23

                            @AZEDINE said in Horizontal text in QTabWidget:

                            moi utilise python est ce que il ya une solition

                            Please use English or post in French sub-forum

                            https://forum.qt.io/topic/113070/qt-code-of-conduct

                            1 Reply Last reply
                            0
                            • A Offline
                              A Offline
                              AZEDINE
                              wrote on last edited by
                              #24
                              This post is deleted!
                              1 Reply Last reply
                              0
                              • SGaistS Offline
                                SGaistS Offline
                                SGaist
                                Lifetime Qt Champion
                                wrote on last edited by
                                #25

                                Hi,

                                Please provide a minimal runnable script that shows your issue.

                                Interested in AI ? www.idiap.ch
                                Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

                                1 Reply Last reply
                                0

                                • Login

                                • Login or register to search.
                                • First post
                                  Last post
                                0
                                • Categories
                                • Recent
                                • Tags
                                • Popular
                                • Users
                                • Groups
                                • Search
                                • Get Qt
                                • Unsolved