在缩小屏幕尺寸时更改填充或边距

我在该行内有一行和两列。一列是col-lg-8，另一列是带有文本的图像和其他col-lg-4。我在右栏填充了文字，可以让文字垂直居中。（我尝试了很多不同的方式来做这件事，但这是最好的方式。）在缩小屏幕尺寸时更改填充或边距

当缩小屏幕时，文本会在图像下方显示。填充保持不变。我知道有一种方法可以在使用@media查询时绕过它，但并不是所有屏幕都是特定的大小。

现在我已经设置了查询是在我的CSS是这样的：

@media screen and (max-width: 991px) 
{ 
    .content{ 
     padding: 20px; 
    } 
}

有没有做这件事的方式它会自动从300像素更改填充，以20像素的文本之下崩溃的那一刻照片？

2017-06-01 Anon187

使用与文本在图像下折叠的断点匹配的媒体查询（如上所述）对我来说似乎是合理的。我知道的唯一单元将使用视口来调整视口大小，如'vh'（视口高度）和'vw'（视口宽度）。虽然YMMV与视口单位。 – hungerstar

使用媒体查询确切的断点或使用javascript – Tom

由于您正在缩小屏幕，但是您添加了col-md-，col-sm-和col-xs- *，这可能是您的问题的解决方案之一。

要放任何元素垂直居中，请使用css属性 align-items：center;和display：flex;

2017-06-01 20:33:31

我还没有添加其他列大小。让我试试看看是否可以。谢谢 – Anon187

是的，希望其他列大小适合你。 –

回答