title: Position content in ExpansionPanelSummary [React Material-UI]
body: <p><a href="https://i.stack.imgur.com/J0UyZ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/J0UyZ.png" alt="Goal"></a></p>
  
  <p>I think the image makes it clear enough, I have two ExpansionPanelSummary components, I'd like to move the icons in the first one to the right next to the ExpandMoreIcon. I've been thinking of using CSS pseudo-selectors to achieve this but nothing so far. There might even be a much simpler solution than that though. My code right now is:</p>
  
  <pre><code> &lt;ExpansionPanelSummary ... /&gt;
     &lt;Typography variant="h6"&gt;Devices&lt;/Typography&gt;
  
     &lt;div ...&gt;
       &lt;IconButton&gt;
         &lt;FilterListIcon  style={{ color: grey[700] }}/&gt;
       &lt;/IconButton&gt;
       &lt;IconButton&gt;
         &lt;SearchIcon  style={{ color: grey[700] }}/&gt;
       &lt;/IconButton&gt;
     &lt;/div&gt;
  
  &lt;/ExpansionPanelSummary&gt;
  </code></pre>
  
  <p><em>Note:</em> I haven't added any styling to the div, the ExpansionPanelSummary has attributes irrelevant to the question.</p>