Как сделать три блока по верх картинки при помощи TailwindCss

Question

Пытаюсь встроить три кнопки в дизайн сайта (в шапку) в TWcss выглядит так:

<link href="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.0.3/tailwind.min.css" rel="stylesheet"/>
<div class="grid grid-cols-1 md:grid-cols-3 text-center place-content-center">
   <div class="bg-blue-100 hover:bg-blue-400 h-images ">
       <a class=" "
           href="#">Первая кнопка</a>
   </div>
   <div class="">
       <a href="#">Вторая кнопка</a>
   </div>
   <div class="">
       <a href="#">Третья кнопка</a>
   </div>
</div>

Вся проблема в том что я не могу выровнять кнопки по центру изображения, и не могу задать им динамическую высоту. Хотел бы чтобы они в моб.версии вставали друг под друга. Как сделать так чтобы кнопки были во всю высоту картинки и чтобы текст у кнопки отображался по центру этой кнопки

БЛОГ НА HUSL

Как сделать три блока по верх картинки при помощи TailwindCss

Ответы (0 шт):