使用浮动功能将文字包围在图片周围

To implement floating for a picture towards the left and have the text below wrap around it:

1. Opt for an image that overlays text elements
2. Access the layout configurations within the Style panel
3. Choose the left float option
4. 包含 填充 to the right and bottom for spacing between the image borders and surrounding content

When aligning an image to the right, don’t forget to incorporate left and bottom padding for spacing.

Clearing an enclosing element

To establish clear visibility on a wrapped component:

1. Choose the element beneath a floated component
2. Access the layout settings within the Style panel
3. Select the desired Clear setting

Constructing tailored columns through floating

You have the ability to utilize floats to arrange elements side by side and occupy the entire width of a parent container, such as the columns section. To craft personalized columns with floats: 

1. Incorporate a div block onto the canvas — this becomes your enveloper
2. Add 3 div blocks within the enveloper
3. Introduce a class to one of the 3 div blocks recently added
4. Fix a width of 33.33% and set the float to the left
5. Apply the same class to the remaining two div blocks

You can likewise utilize floats to shift an element to the left or right within a parent container. The method remains consistent with what was described for floating an image above.

Flexbox can handle all layout responsibilities mentioned earlier more conveniently and effectively. Discover more about employing flexbox.

‍