Title: Weird button CSS
Last modified: November 20, 2023

---

# Weird button CSS

 *  [loudfan](https://wordpress.org/support/users/loudfan/)
 * (@loudfan)
 * [2 years, 6 months ago](https://wordpress.org/support/topic/weird-button-css/)
 * I’ve noticed that when I add a Buttons block, the CSS is kind of messed up and
   leaves a space at the top but not at the bottom of the button. Curious why this
   is the default for GeneratePress? Is there a simple fix or something I’m missing?
    -  This topic was modified 2 years, 6 months ago by [loudfan](https://wordpress.org/support/users/loudfan/).
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fweird-button-css%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 5 replies - 1 through 5 (of 5 total)

 *  [Leo](https://wordpress.org/support/users/leohsiang/)
 * (@leohsiang)
 * [2 years, 6 months ago](https://wordpress.org/support/topic/weird-button-css/#post-17216884)
 * Hi there,
 * Any chance you can link us to the page in question?
 * Let me know 🙂
 *  Thread Starter [loudfan](https://wordpress.org/support/users/loudfan/)
 * (@loudfan)
 * [2 years, 6 months ago](https://wordpress.org/support/topic/weird-button-css/#post-17216909)
 * I linked to a screenshot in the original post, but now I’ve substituted a link
   to the page. I had to put spacers in underneath the buttons, which is what I’ve
   consistently done. (I develop websites for authors, so I use a LOT of buttons…
   I finally got tired of wondering why I always have to put spacers underneath 
   them!!)
 *  [ying](https://wordpress.org/support/users/yingscarlett/)
 * (@yingscarlett)
 * [2 years, 6 months ago](https://wordpress.org/support/topic/weird-button-css/#post-17216985)
 * Hi there,
 * The space you are seeing above the buttons is from the paragraphs above the buttons,
   as the paragraphs have a default `margin-bottom` set to 1.5em.
 *  Thread Starter [loudfan](https://wordpress.org/support/users/loudfan/)
 * (@loudfan)
 * [2 years, 6 months ago](https://wordpress.org/support/topic/weird-button-css/#post-17216989)
 * What about the (lack of) space below the buttons?
 *  [ying](https://wordpress.org/support/users/yingscarlett/)
 * (@yingscarlett)
 * [2 years, 6 months ago](https://wordpress.org/support/topic/weird-button-css/#post-17217008)
 * The button itself does not have any spacing around it as WP sets its margin to
   0. GP theme does not add any spacing to it as well, would you like to add spacing
   to it? If so, you can try this CSS. The CSS includes both top and bottom margin,
   you can remove the margin-top if the paragraph margin works for you.
 *     ```wp-block-code
       .wp-block-buttons>.wp-block-button {
           margin-top: 20px;
           margin-bottom: 20px;
       }
       ```
   

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Weird button CSS’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/generatepress/3.6.1/screenshot.
   png)
 * GeneratePress
 * [Support Threads](https://wordpress.org/support/theme/generatepress/)
 * [Active Topics](https://wordpress.org/support/theme/generatepress/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/generatepress/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/generatepress/reviews/)

## Tags

 * [buttons](https://wordpress.org/support/topic-tag/buttons/)
 * [css](https://wordpress.org/support/topic-tag/css/)

 * 5 replies
 * 3 participants
 * Last reply from: [ying](https://wordpress.org/support/users/yingscarlett/)
 * Last activity: [2 years, 6 months ago](https://wordpress.org/support/topic/weird-button-css/#post-17217008)
 * Status: not resolved