I'm starting with creating Gutenberg blocks with ACF. I would like to create a simple button, so far so good. My problem comes from the center alignment. When I align my element to the left and right it works, but centering it no longer works.

How could I go about resolving this? In your opinion, is it appropriate to change the initial css of the positions with something more personalized? If for example I want to replace float:right with display:flex, justify-content: center?


$className = 'myclass';
if( !empty( $block['align'])){
    $className .= ' align' . $block['align'];

<div class="<?php echo esc_attr($className);?>">
  <a href="#" role="button" tableindex="0" class="mybutton">My button</a>


  display: inline-block;
  background: black;
  padding: 1rem 2rem;


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.