[Card] Align icons with ListItem (#12292)

<!-- Thanks so much for your PR, your contribution is appreciated! ❤️ -->
Closes #12291 

![image](https://user-images.githubusercontent.com/357702/43292552-be1ede14-912d-11e8-9dca-9f05755242e3.png)

Author: mbrookes

docs/src/pages/demos/cards/RecipeReviewCard.js

@@ -34,6 +34,9 @@ const styles = theme => ({
       duration: theme.transitions.duration.shortest,
     }),
     marginLeft: 'auto',
+    [theme.breakpoints.up('sm')]: {
+      marginRight: -8,
+    },
   },
   expandOpen: {
     transform: 'rotate(180deg)',

packages/material-ui/src/CardHeader/CardHeader.js

@@ -22,7 +22,10 @@ export const styles = theme => ({
     flex: '0 0 auto',
     alignSelf: 'flex-start',
     marginTop: -8,
-    marginRight: -16,
+    marginRight: -12,
+    [theme.breakpoints.up('sm')]: {
+      marginRight: -20,
+    },
   },
   /* Styles applied to the content wrapper element. */
   content: {