Блог

В настоящее время у меня есть SVG, который я разместил за другим div на странице, SVG действует как фоновая текстура, в то время как div-это место, куда будет помещено все основное содержимое страницы. Я хотел немного передвинуть текстуру фона вниз, чтобы освободить место для того, чтобы вверху была строка меню, и она переполнялась по оси x, я попытался установить значение переполнения изображений-x в скрытое, а также поместить изображение в контейнер и попробовал это сделать, но, похоже, я не могу заставить его работать. Я все еще хочу иметь возможность прокручивать основной div, если он исчезнет со страницы, но я не уверен, как это сделать.

HTML

 lt;templategt;  lt;div style="width: 100%; height: 100%; overflow: hidden"gt;  lt;img src="graphics/smoke.svg" class="smoke-background"gt;  lt;/divgt;  lt;div class="center-column"gt;  lt;Lineup lineup="images/bind/1a.png" location="images/bind/1b.png" landing="images/bind/a-default.png"/gt;  lt;/divgt; lt;/templategt;  

CSS

 .center-column{  display: flex;  position: absolute;  left: 0;   right: 0;   margin-left: auto;   margin-right: auto;  width: 66.66%;  height: 100%;  background-color: #24252E;  border-left: 2px solid #FF4650;  border-right: 2px solid #FF4650; } .smoke-background{  position: absolute;  top: 10%;  height: 100%;  width: 100%; }  

Пример