diff --git a/Chapters/bloc/element.md b/Chapters/bloc/element.md
index cbb7877..0bd24d6 100644
--- a/Chapters/bloc/element.md
+++ b/Chapters/bloc/element.md
@@ -27,11 +27,12 @@ the `BlUniverse`, providing a clear overview of your active spaces.
 #### Ready to Build: Creating Your First Bloc Component
 
 ```smalltalk
-BlElement new
+blueRectangle := BlElement new
 	geometry: BlRectangleGeometry  new;
 	size: 200 @ 100;
 	background: Color blue;
-	openInNewSpace
+	yourself.
+blueRectangle openInNewSpace
 ```
 
 ![Creating a basic element.](figures/basicElement.png)
@@ -47,6 +48,67 @@ Specify the element's size and color to customize its visual characteristics.
 4. **Bring it to life:** Finally, open the element in a new space, making it visible on the screen.
 
 
+In our example, we can observe the state of your element by inspecting the `blueRectangle` variable. We can observe a graphical overview of the element, as well as its state:
+
+![Creating a basic element.](figures/basicElementInspection.png)
+
+Elements are organized in trees. 
+To compose tree of elements, we select a root element and we add children.
+
+```smalltalk
+redRectangle := BlElement new
+	geometry: BlRectangleGeometry  new;
+	size: 50 @ 50;
+	background: Color red; 
+	yourself.
+blueRectangle addChild: redRectangle
+```
+
+1. **Start with a root element of your choice:** in our example, we reuse the `blueRectangle` element.
+2. **Define the new element:** This is done like any other element, such as the `blueRectangle` element.
+In this example, we will use a red rectangle, but smaller than the blue one.
+3. **Add the new element as a child of the root element:** 
+The `addChild:` api adds leaf elements to a root.
+4. **Bring it to life:** If the `blueRectangle` is still open, it automatically updates with the `redRectangle`. Else, re-execute all the code to open the root in a new space, making it visible on the screen.
+
+![Composing elements.](figures/composedElements.png)
+
+The red element is placed on the top left corner of its parent, the blue element.
+By default, the position of `BlElement` instances is `0@0`.
+The position of elements is configured by using the `position:` api, such as in the following:
+
+```Smalltalk
+redRectangle position: 75@25. 
+```
+
+![Changing elements positions.](figures/basicElementPosition.png)
+
+Notice that if you did not close the original space opened for the `blueRectangle` element, the display automatically updates when the `redRectangle` position changes.
+
+## Spaces: where elements are displayed
+
+Spaces represent windows in which elements are displayed.
+They are explicitely controlled by instantiating `BlSpace` objects.
+A space has a root element, to which other elements are attached using the `addChild:` api.
+In the following example, we create a new space in which we add our two rectangles:
+
+```Smalltalk
+space := BlSpace new.
+space root addChild: blueRectangle.
+space root addChild: redRectangle.
+space show
+```
+An element can only be the child of a single other element.
+If an element is already added as a child in a space, trying to add that element to a new space will raise an exception. 
+One solution is to create new instances of that element to add it to another space.
+
+## Exercise
+
+Create a $10\times10$ grid of squares, each with a random color, and display it in a space.
+
+![Creating a grid of elements.](figures/elementsGrid.png)
+
+
 ### Geometry of BlElement
 
 In Bloc, the visual form and boundaries of your UI elements are determined by their geometry. 
diff --git a/Chapters/bloc/figures/basicElement.png b/Chapters/bloc/figures/basicElement.png
index 0301a99..875e19a 100644
Binary files a/Chapters/bloc/figures/basicElement.png and b/Chapters/bloc/figures/basicElement.png differ
diff --git a/Chapters/bloc/figures/basicElementInspection.png b/Chapters/bloc/figures/basicElementInspection.png
new file mode 100644
index 0000000..3480d43
Binary files /dev/null and b/Chapters/bloc/figures/basicElementInspection.png differ
diff --git a/Chapters/bloc/figures/basicElementPosition.png b/Chapters/bloc/figures/basicElementPosition.png
new file mode 100644
index 0000000..8474288
Binary files /dev/null and b/Chapters/bloc/figures/basicElementPosition.png differ
diff --git a/Chapters/bloc/figures/composedElements.png b/Chapters/bloc/figures/composedElements.png
new file mode 100644
index 0000000..8e14542
Binary files /dev/null and b/Chapters/bloc/figures/composedElements.png differ
diff --git a/Chapters/bloc/figures/elementsGrid.png b/Chapters/bloc/figures/elementsGrid.png
new file mode 100644
index 0000000..9de40be
Binary files /dev/null and b/Chapters/bloc/figures/elementsGrid.png differ
diff --git a/_support/latex/sbabook/sbabook.cls b/_support/latex/sbabook/sbabook.cls
index a223f21..4a3e79c 100644
--- a/_support/latex/sbabook/sbabook.cls
+++ b/_support/latex/sbabook/sbabook.cls
@@ -104,6 +104,7 @@
 % footnotes at bottom of page instead of below text (which is ragged bottom)
 % also moves footnotes below bottom-of-page floats
 \RequirePackage[bottom]{footmisc}
+%\justifying
 
 %%%
 %%% Title page