Переопределение точек останова Tailwind CSS не работает - PullRequest
0 голосов
/ 24 июня 2019

Я не могу понять, почему адаптивные переопределения попутного ветра не работают в моем проекте.

Например, я бы хотел, чтобы следующий текст в div был центрирован под точкой останова маленького экрана и оставлен слева-выровнен выше точки останова sm.Следующий код, кажется, работает, когда я пробую его в codepen .Тем не менее, это не работает в моем проекте Laravel.

<div class="text-grey-4 flex-1 px-6 sm:text-left text-center self-center">

    <h2 class="h2">Heading Text</b></h2>
    <div>
      Lorum ipsum lorum ispum lorum ipsum Lorum ipsum lorum ispum lorum ipsum Lorum ipsum lorum ispum lorum ipsum
    </div>

 </div>

Есть идеи, почему это происходит?

1 Ответ

0 голосов
/ 24 июня 2019

Каждый раз, когда вы разрабатываете что-то с Tailwind, начинайте с мобильного.

<div class="text-center sm:text-left">
  Lorem ipsum dolor sit amet.
</div>

Так что в основном на этом примере.Вместо того, чтобы говорить:

Текст должен быть центрирован только на небольших устройствах.

Сделайте это:

Текст должен быть всегда центрирован, ивыровнен влево для больших устройств.

https://codepen.io/anon/pen/wLeoYV

...