在縮小屏幕尺寸時更改填充或邊距

我在該行內有一行和兩列。一列是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

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

回答