How to fix a bug with wrong text position?

Question

css

How do I fix the text wrapping bug so that the book title "Shutter Island" wraps the same way as the previous two titles?

<div class="left_menu_book">
        <div class="left_menu_content_book_icon">
          <a href="#">
            <img src="Book_icon_64.png">
          </a>
        </div>
        <div class="left_menu_content_book_title">
        Остров проклятых
        </div>
      </div>

.left_menu_content {
        position: relative;
        top: 75px;
        height: calc(100% - 55px);
        width: 100%;
      }
      .left_menu_content_book_icon {
        text-align: -webkit-left;
      }
      .left_menu_content_book_title {
        text-align: -webkit-right;
        margin-top: -64px;
        display: none;
        font-family: 'Trebuchet MS';
    			font-size: 25px;
    			transition: .3s;
      }

Answer 1

Like, obviously

.left_menu_content_book_title {
  padding: 0 0 0 64px;
}

Update: It was easier to fix the code. It turned out like this .