diff --git a/2-ui/2-events/03-event-delegation/2-sliding-tree/solution.md b/2-ui/2-events/03-event-delegation/2-sliding-tree/solution.md
@@ -1,4 +1,4 @@
-The solution has two parts.

-1. Wrap every tree node title into `<span>`. Then we can CSS-style them on `:hover` and handle clicks exactly on text, because `<span>` width is exactly the text width (unlike without it).
-2. Set a handler to the `tree` root node and handle clicks on that `<span>` titles.
diff --git a/2-ui/2-events/03-event-delegation/2-sliding-tree/task.md b/2-ui/2-events/03-event-delegation/2-sliding-tree/task.md
@@ -2,13 +2,13 @@ importance: 5

---

-# Tree menu

-Create a tree that shows/hides node children on click:

[iframe border=1 src="solution"]

-Requirements:

-- Only one event handler (use delegation)
-- A click outside the node title (on an empty space) should not do anything.
diff --git a/2-ui/2-events/03-event-delegation/3-sortable-table/task.md b/2-ui/2-events/03-event-delegation/3-sortable-table/task.md
@@ -2,11 +2,11 @@ importance: 4

---

-# Sortable table

-Make the table sortable: clicks on `<th>` elements should sort it by corresponding column.

-Each `<th>` has the type in the attribute, like this:

```html
<table id="grid">
@@ -32,12 +32,12 @@ Each `<th>` has the type in the attribute, like this:
</table>
```

-In the example above the first column has numbers, and the second one -- strings. The sorting function should handle sort according to the type.

-Only `"string"` and `"number"` types should be supported.

-The working example:

[iframe border=1 src="solution" height=190]

-P.S. The table can be big, with any number of rows and columns.
diff --git a/2-ui/2-events/03-event-delegation/4-behavior-tooltip/task.md b/2-ui/2-events/03-event-delegation/4-behavior-tooltip/task.md
@@ -2,37 +2,38 @@ importance: 5

---

-# Tooltip behavior

-Create JS-code for the tooltip behavior.

-When a mouse comes over an element with `data-tooltip`, the tooltip should appear over it, and when it's gone then hide.

-An example of annotated HTML:
```html
<button data-tooltip="the tooltip is longer than the element">Short button</button>
<button data-tooltip="HTML<br>tooltip">One more button</button>
```

-Should work like this:

[iframe src="solution" height=200 border=1]

-In this task we assume that all elements with `data-tooltip` have only text inside. No nested tags (yet).

-Details:

-- The distance between the element and the tooltip should be `5px`.
-- The tooltip should be centered relative to the element, if possible.
-- The tooltip should not cross window edges. Normally it should be above the element, but if the element is at the page top and there's no space for the tooltip, then below it.
-- The tooltip content is given in the `data-tooltip` attribute. It can be arbitrary HTML.

-You'll need two events here:
-- `mouseover` triggers when a pointer comes over an element.
-- `mouseout` triggers when a pointer leaves an element.

-Please use event delegation: set up two handlers on `document` to track all "overs" and "outs" from elements with `data-tooltip` and manage tooltips from there.

-After the behavior is implemented, even people unfamiliar with JavaScript can add annotated elements.

-P.S. Only one tooltip may show up at a time.