title: Applying a Qt style sheet to a QPushButton and a QToolButton
body: <p>I'm trying to create a widget which will have similar behaviour to a QComboBox, but with different behaviours depending on whether the user clicks on the arrow or elsewhere on the widget. For starters, I'm modelling the widget itself as a wide QPushButton with a QToolButton superimposed on it. Once I have this looking as I want it to, I'll add a QListView to provide the drop-down menu and make it appear whenever the unit presses the QToolButton (but not the QPushButton). My basic test code so far looks like this:</p>
  
  <pre><code>#include &lt;QtWidgets/QApplication&gt;
  
  #include &lt;QDialog&gt;
  #include &lt;QPushButton&gt;
  #include &lt;QToolButton&gt;
  #include &lt;QPushButton&gt;
  #include &lt;QGridLayout&gt;
  
  class StylesheetTest : public QDialog
  {
      Q_OBJECT
  public:
      StylesheetTest(QWidget * parent = nullptr) : QDialog(parent)
      {
          // Create the widgets and layouts
          itsLayout = new QGridLayout;
          itsMainButton = new QPushButton;
          itsDropdownButton = new QToolButton;
  
          // Place the widgets in the layout:
          itsLayout -&gt; addWidget(itsMainButton, 0, 0, 1, 2);
          itsLayout -&gt; addWidget(itsDropdownButton, 0, 1, 1, 1);
          itsLayout -&gt; setSpacing(0);
          itsLayout -&gt; setColumnStretch(0, 1);
          itsMainButton -&gt; setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Fixed);
          itsDropdownButton -&gt; setSizePolicy(QSizePolicy::Fixed, QSizePolicy::Fixed);
          itsDropdownButton -&gt; setArrowType(Qt::DownArrow);
  
          // Formally appoint the layout
          setLayout(itsLayout);
  
          // Now the stylesheet settings
          setStyleSheet("QToolButton { border: none; } ");
  
          // Give the button a label
          itsMainButton -&gt; setText("An extraordinarily long label for a button");
      }
  
  private:
      QPushButton *itsMainButton;
      QToolButton *itsDropdownButton;
      QGridLayout *itsLayout;
  };
  
  int main(int argc, char *argv[])
  {
      QApplication a(argc, argv);
      StylesheetTest t;
      t.show();
      return a.exec();
  }
  
  #include "main.moc"
  </code></pre>
  
  <p>This gets me most of the way there; the resulting button looks like this:</p>
  
  <p><img src="https://i.stack.imgur.com/UiD3F.png" alt="First attempt"></p>
  
  <p>It looks very much like a QComboBox, but I get the independent behaviours of the QPushButton and the QToolButton, just as I want. However, I'd like to make it even better:</p>
  
  <ul>
  <li>I'd like to set a bit of a margin on the right-hand side of the QPushButton, so that the text doesn't overlap the arrow</li>
  <li>I'd like the arrow itself to be a bit smaller</li>
  </ul>
  
  <p>Everything I know about style sheets (which admittedly isn't much) tells me that to achieve this I need something resembling</p>
  
  <pre><code>    // Now the stylesheet settings
      setStyleSheet("QPushButton { padding-right: 20px; }");
      setStyleSheet("QToolButton { border: none; } "
                    "QToolButton::down-arrow { width: 8px; height: 8px; }" );
  </code></pre>
  
  <p>but in fact the result of this is a mess:</p>
  
  <p><img src="https://i.stack.imgur.com/g7lFT.png" alt="Second attempt - much worse"></p>
  
  <p>Further experimentation shows that trying to set the 'padding-right' parameter of the QPushButton to any value at all leads to its vertical height getting squeezed in this way, while all attempts to modify the size of the down-arrow fail. I'm obviously doing something wrong, but I can't see what. Any hints would be gratefully received.</p>
  
  <p><strong>UPDATE</strong></p>
  
  <p>I've decided that a better approach is, rather than using a QToolButton in front of a QPushButton and having manually to implement the QListView behaviour, to put a QPushButton in front of a QComboBox leacing just the latter's arrow exposed. Like this:</p>
  
  <pre><code>#include &lt;QtWidgets/QApplication&gt;
  
  #include &lt;QDialog&gt;
  #include &lt;QPushButton&gt;
  #include &lt;QComboBox&gt;
  #include &lt;QGridLayout&gt;
  
  class StylesheetTest : public QDialog
  {
      Q_OBJECT
  public:
      StylesheetTest(QWidget * parent = nullptr) : QDialog(parent)
      {
          // Create the widgets and layouts
          itsLayout = new QGridLayout;
          itsMainButton = new QPushButton;
          itsHiddenComboBox = new QComboBox;
  
          // Place the widgets in the layout:
          itsLayout -&gt; addWidget(itsHiddenComboBox, 0, 0, 1, 3);
          itsLayout -&gt; addWidget(itsMainButton,     0, 0, 1, 2);
          itsLayout -&gt; setSpacing(0);
          itsLayout -&gt; setColumnStretch(0, 1);
          itsLayout -&gt; setColumnMinimumWidth(2, 20);
          itsMainButton -&gt; setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Minimum);
          itsHiddenComboBox -&gt; setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Minimum);
          setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Maximum);
  
          // Formally appoint the layout
          setLayout(itsLayout);
  
          // Now the stylesheet settings
          setStyleSheet("QPushButton { border: none; padding-left: 10px; } ");
          itsMainButton -&gt; setText("An extraordinarily long label for a button");
      }
  
  private:
      QPushButton *itsMainButton;
      QComboBox   *itsHiddenComboBox;
      QGridLayout *itsLayout;
  };
  
  int main(int argc, char *argv[])
  {
      QApplication a(argc, argv);
      StylesheetTest t;
      t.show();
      return a.exec();
  }
  
  #include "main.moc"
  </code></pre>
  
  <p>The one shortcoming of this solution is that, having eliminated the border from the QPushButton, it no longer responds visibly to being clicked (even though the usual signals are sent). This has been documented elsewhere: see <a href="https://stackoverflow.com/questions/3800757/qt-no-border-on-buttons-making-them-non-clickable">here</a>. As it happens I can cope with this, as my ultimate intention is for pressing the QPushButton to cause a change of the cursor and this will make it obvious enough to the user that the button has been successfully clicked.</p>