Блог

Я сталкиваюсь с проблемой CSS при разработке приложения погоды. Итак, вот как это происходит.

 <ion-card *ngIf="...">

</ion-card>

<ion-list *ngIf="...">
    <ion-card></ion-card>
</ion-list>

<ion-card>
...
</ion-card>

<ion-card>
...
</ion-card>
  

На основе данных с сервера для возврата будет вызван либо первый ion-card , либо ion-list:

1. Нет предупреждения ( ion-card );
2. Есть (находятся) предупреждения. ( ion-list )

Однако я замечаю, что существует огромный разрыв между ion-list, который показывает эту информацию о предупреждении, и ion-card следующим.

Что я пробовал:

1. Примените стиль CSS к ion-list с помощью !важно.
2. Примените стиль CSS к ion-card с помощью !важно.

Первые две карты, как показано выше, находятся внутри ion-list (информация о предупреждении). Вы заметите огромный разрыв между вторым и третьим ion-card — это результат чрезвычайно большого запаса в ion-list. Я просто понятия не имею, как решить эту проблему. Кто-нибудь может мне помочь?

Редактировать: изображение, похоже, не загружено.