A little not beautiful display on narrow screens?

Question

css

In general, I have a simple question ...
Here is the page --> https://jsfiddle.net/yvnmuoza/
I use Bootstrap 4.
I am not satisfied with the fact that with a small width, the title of the book "Anna Karenina" does not fit, and " Karenina" goes down ... and "Anna" remains in place ...
I don't understand how to make the text "Anna Karenina" move immediately down, under the picture ...
Tell me ...

Answer 1

Write the h2 header property display: inline-block

h2{
   display: inline-block;
}