网格箱的最小像素

Question

在此处输入图像描述我有一个带有2个网格箱，3fr和1,5fr的网格箱。现在，我想制作一个具有“ Gridbox 2（1,5FR）小于100px的CSS，请转到下一行。我不知道这是否可能。

Answer 1

我认为Flexbox对于您想要做的事情可能会更容易，但是如果您想使用网格，则必须使用@Media。

.container{
    display: grid;
    grid-template-columns: minmax(200px,3fr) minmax(100px, 1.5fr);
}

@media screen and (max-width:330px) {
    .container{
      grid-template-columns: 1fr;
    }
}

您可能必须根据您的特定代码调整数字，但这将使“容器”类中的元素在低于阈值时占用100％。