Hi, I found a little problem when aligning images to a certain extent, it aligns well to the left and centered, but when aligning to the right it overflows over the text, the same if you add a button, it overflows over it, I leave a video that shows what happens !!!
@Norm
V.3.4.9
Why not use a 3 column structure: 1) for the ‘left-aligned text’; 2) the image; 3) the 3rd content area, and then adjust padding for the text column to fit your needs? Then use column ‘Order’ for adjusting columns per breakpoint?
Because that would do more additional code, and there would be no point in an image or button aligning to the left and center … but it doesn’t work when you align it to the right!
it is a good alternative, but it does not solve the problem.
that’s a serious mistake!
Is this a problem with blocs are a problem of how to use blocs…? I mean this with out judgement, but doesn’t blocs have a way to achieve the desired results but within the capacities it offers to minimize the need for self-coding??
Sure, using three columns is easy to get the job out, but it still doesn’t fix the problem.
It’s happening because you created an inline image. Basically, you’ve got a column of a fixed width and you’ve placed an image within the column. You’ve then adjusted the image width within the column. When you align the image to the right, because the text is left-aligned the text flows around the image.
Apart from the fact that the thing looks awful and rather dated, if you simply must have this sort of arrangement, you need to add a 2 column bric between the header and the paragraph text (nesting columns within a column). This will create two even columns between the header and the paragraph text. Simply add your image to the second column and then adjust the width of the first column to create the offset you want on the left of the image. Remember, images will always fill the width of the column they are placed in, so just make sure your image is within a column. If you want to adjust the width of the image, it’s better to adjust the width of the column that the image sits in. The paragraph text will then remain below the image. Here is an example:
