# Group

Group blocks are used to create nested collections of blocks; they may also be given a background colour, allowing you to break up the appearance of a page.

Blocks may be moved within a group, or the block may be moved on the page, which will update move its contents too.

<p class="callout info">Adjusting a Group will adjust the blocks within it as well, e.g. reducing the width of the Group will make the blocks within it smaller, or changing the background colour of the Group will override the background colour of blocks within it. </p>

To add a block to a Group, simply drag and drop it over the Group.

## Appearance

[![image.png](https://bookstack.iconography.co.uk/uploads/images/gallery/2024-11/scaled-1680-/Y2wimage.png)](https://bookstack.iconography.co.uk/uploads/images/gallery/2024-11/Y2wimage.png)

## Editing the Block

### Settings


<table border="1" id="bkmrk-field-purpose-block-" style="border-collapse: collapse; width: 100%; border-width: 1px;"><colgroup><col style="width: 49.881%;"></col><col style="width: 49.881%;"></col></colgroup><thead><tr><td>Field</td><td>Purpose</td></tr></thead><tbody><tr><td>Block Width</td><td>*Choose from:*

- *25%*
- *33%*
- *50%*
- *66%*
- *75%*
- *100%*
- *Full Width (set to always be the full width of the user's device)*

</td></tr><tr><td>Visibility</td><td>*Set the block visibility from the list:*

- *Default (both)*
- *Desktop Only*
- *Mobile Only*
- *Hidden (none)*

</td></tr><tr><td>Background Colour</td><td>*Choose a background colour for your image. Choose from recommended colours, or use a colour picker.* </td></tr></tbody></table>

#### Additional Options

<table border="1" id="bkmrk-field-purpose-invert" style="border-collapse: collapse; width: 100%; border-width: 1px;"><colgroup><col style="width: 49.947%;"></col><col style="width: 49.947%;"></col></colgroup><thead><tr><td>Field</td><td>Purpose</td></tr></thead><tbody><tr><td>Invert text colour</td><td>*Toggle to invert the text colour*</td></tr><tr><td>Content contained?</td><td>*Toggle to contain the Content - this will affect the maximum width available to the content in the Group*</td></tr></tbody></table>

### Advanced

#### Padding

Adding padding will insert space within the current block; this will adjust the position of content within the block.

More information is available [here](https://bookstack.iconography.co.uk/books/general/page/padding).

#### Margin

The margin will add additional space around the current block.

More information is available [here](https://bookstack.iconography.co.uk/books/general/page/margin).