Gutenberg block column with "alignright" not working as expected

[bjuwebteam]

I am trying to create a block column row where the first column (containing an image and caption) is aligned right and shows up after the second column (containing text) at full page width. (So that when the row collapses at mobile resolutions, the image appears first and the text comes after.)

You can see a simplified version of the code I used on my test page below, however, the first column is not getting aligned right as expected. When I inspect the page using developer tools in my browser, I can see that the "alignright" CSS styles (including "float:right;") are getting applied to the column, and it does not look as though anything else is interfering, yet the column does not actually float right. The problem occurs both in my current theme and in Twenty Nineteen.

<div class="wp-block-columns has-2-columns">
	<div class="wp-block-column alignright">
		<img src='https://placekitten.com/g/500/500' />
		<p><em>Image Caption</em></p>
	</div>
	<div class="wp-block-column alignleft">
		<h2>A Header</h2>
		<p>Some content goes here.</p>
	</div>
</div>

[bjuwebteam]

Column Alignment Issue Screenshot

[desrosj]

Hi @bjuwebteam!

Welcome to Trac! This seems to be an issue that would need fixing upstream in the Gutenberg GitHub repository. I have ​transferred this issue there so it can be addressed.

If my evaluation is wrong, we can reopen this ticket.