SOLVED: Align Wide/Full - Gutenberg Image Blocks - 1.3.6

I’ve been testing the align wide and full width options inside the gutenberg builder (really happy you support them btw!)

They seem to be broken on this site and I can’t figure out why:

Any idea what might be wrong?

@timmse Any idea what’s going on here?

Thank you

Hi Dean,

Gutenberg needs a little more attention from us, we are aware of that. In the meantime, please try this and let me know if it works!

.alignfull, .wp-block-image.alignfull {
  margin-left: calc( -100vw / 2 + 100% / 2 );
  margin-right: calc( -100vw / 2 + 100% / 2 );
  max-width: 100vw;
  width: 100vw;
  left: unset;
  right: unset;
}

.alignwide, .wp-block-image.alignwide {
  width: 100%;
  max-width: 100%;
}

@media (min-width: 768px) {
  .alignwide, .wp-block-image.alignwide {
    margin-left: -10%;
    margin-right: -10%;
    width: 120%;
    max-width: 120%;
  }
}

Best regards,
timmse

1 Like

That fixed it! Thank you very much

1 Like