Как отображать переменные данные по вертикали в Laravel 5.6?

Question

с использованием Laravel 5.6 и в моем приложении у меня есть блок div для отображения переменных данных.в настоящее время он отображает по горизонтали, как это, данные тега div показывают

, и это мой тег div,

<div style="border-style: solid; color: black; ">
                            <img src="/images/{{ $upload->resized_name }}" height="150" width="250"></a>
                        {{ Carbon\Carbon::parse($vehicule->created_at)->diffForHumans()}} 
                            {{$vehicule->provincename}}
                          {{$vehicule->milage}}
                          </div>

, но мне нужно показать эти данные как вертикально в этомтег div.как я могу это сделать?

Answer 1

Сначала вы можете использовать display: flex в родительском контейнере для горизонтального размещения содержимого. Затем оберните переменные в неупорядоченный список ul и сделайте их li элементами.

Обратите внимание, что я завернулul в div

.container {
  display: flex;
}

/* Just for the demo */
ul { 
  list-style: none;
}

<div class="container">
  <img src="https://fillmurray.com/150/170"/>
  <div class="data-container">
    <ul>
      <li>Province name variable</li>
      <li>Milage variable</li>
    </ul>
  </div>
</div>