Html 如何将网站标题移到横幅图像上方

我的网站横幅突然出现在标题文本上方，而不是下方。我已经修复了桌面版的CSS，但我无法在手机上正常使用。 （它是wordpress，文本作为标题和标语添加）

有人能告诉我代码应该是什么吗

网站是www.flowersforeveryone.co.za

@media (max-width: 475px){
    .page-banner-wrap .page-banner .page-header > .page-title{
        font-size: 14pt;
        line-height: 1.2;
}

#lsx-banner .tagline{
font-size: 9pt;

}

.page-banner-wrap .page-banner > .page-banner-image{
    height: 30vh;
position: relative;
}

---

下面的CSS应该可以解决这个问题。我不知道为什么会这样。我假设DOM标记已更改，因此横幅不再正确显示。您可能需要调整以下设置。这只是一个开始的提示。我使横幅很吸引人，但仍有改进的余地。我重新定位了背景（更改了较小屏幕设备的大小-720px/768px断点），并将图像容器拉伸到特定的屏幕大小（酷..谢谢！我将此添加到自定义CSS脚本的底部，但现在对于移动设备，横幅图像根本不会出现…@Michelle我添加了

position:absolute；

现在至少对我来说应该可以了。你知道清理CSS代码的最佳方法吗？我可能在其他地方也有代码引用这些相同的元素，不是吗帽子可能会盖过东西？（我不太明白，不能把它弄糟）@手动检查可能的覆盖并不容易。但是有一些浏览器插件和网站可以测试您的网站是否有过时的CSS。但是请注意，这可能会限制在每页的基础上。因此，可能会在A页上使用的CSS可能不会在B页上使用。因此，您必须小心。我没有很好的建议。但可能是这样在该主题上打开另一个线程很有用。@Michelle如果覆盖包含许多规则，则可能值得检查未使用的内容。如果只有少数规则，则可能根本不值得。但通常情况下，传输过程中节省的每一位都是好的；）。但我不会搞得太乱，除非有可能优化的空间。优化图像、最小化资源通常可以节省更多的CSS规则。

.page-banner-wrap .page-banner > .container {
    margin-top: 20px;
}  

.page-banner-wrap .page-banner > .page-banner-image {
    background-position: 50% 65% !important;
}    

@media only screen and (max-width: 991px)
.page-banner-wrap .page-banner > .page-banner-image {
    height: 100%;
    position: absolute;
}

@media (max-width: 768px)
.page-banner-wrap .page-banner > .page-banner-image {
    background-size: 350px;
}

@media (max-width: 720px)
.page-id-10 .page-banner-wrap .page-banner > .page-banner-image {
    background-size: 300px;
}