Совместите первую строку на следующую строку

Question

Я просто не могу понять, как сделать эту простую вещь,

WEB PAGE: PAGE
Fiddle: Fiddle

Можете ли вы перейти на эту страницу и см. ... Недавняя активность раздел, имеет текст после имени и стрелок, и этот текст выглядит не очень хорошо, он идет ниже изображения, и это то, что я хочу исправить, мне нужно, чтобы он был немного выровнен с первой строкой, и это может сделать это хорошо, я могу 't даже проверить, как это будет выглядеть, и если это не выглядит так, пожалуйста, помогите мне сделать его хорошо выглядеть ...

Это тоже выглядит glitchy, и я хочу, чтобы он выглядел лучше, я Я нуб в CSS так, пожалуйста, помогите ...

Я добавил скрипку, чтобы понять, Вот код, который вы, возможно, потребуется изменить ...

<li> 
     <img src="assets\images\avatar_100x\163.png" class="w35" alt="Tony Toomport"> 
     <span class="user font-slab">Tony Toomport </span> 
     <span class="subject"> has been given rank 7 (OG) in Los Santos Maddogs (14) by Leader Tyson Maddog (rank 9).</span> 
    > /* I wan't this^to look good when there are 2 lines(on small screens), because it currently goes under the image and does not look good... */ 
     <span class="time"><i class="fa fa-clock-o"></i> 2 hour's ago</span> 
    </li> 

Пожалуйста, помогите мне хотя бы сказать, что мне делать чтобы сделать вторую линию выровненной с первыми строками, начиная ...

БЛАГОДАРЯ

Answer 1

Вы можете использовать display: inline-block; и position: absolute;, чтобы сделать это.

И добавить стиль, например margin-top: 8px;

.subject{ 
    display: inline-block; 
    position : absolute; 
    margin-top: 8px; 
} 

Fiddle: Link