Images in rich text fields have extra elements

Images inserted via the 'Image' button in hallo.js rich text fields have extra elements around them that make it hard to apply consistent styles:

```html
<p>
    <img src="...">
    <br>
</p>
```

I looked in to the hallo.js image plugin used, and modified it such that it inserts images just before the current selection point if the selection is empty, and at the start of the container. This unfortunately has some side effects that spoil further editing somewhat:

1. If text is typed around the image, it is not contained in any `<p>` tag or similar:

    ```html
    <p>Before</p>
    <img src="..."> Extra text
    <p>Before</p>
    ```

2. If a new line is inserted after the `<img>`, a new `<div>` is created, instead of a new `<p>`.

    ```html
    <img src="...">
    <div>...</div>
    ```

There are likely more issues as well, but I gave up hunting at this point.

It would be excellent if `<img>` tags were not wrapped as they currently are, but solving it seems rather more involved than I had initially thought. Does anyone have more experience dealing with this, or any ideas where to start fixing this?

cc @jonnyscholes