css - 如何垂直居中我的网站标题？

Question

我正在尝试将我的网站的标题和品牌垂直居中以用于平板电脑和智能手机模式：https ://odetomytravels.com/

我只想将 CSS 代码添加到网站主题部分“附加 CSS”。

谢谢 ！

site-title site-branding {
vertical-align: middle !important;
}

目前，在平板电脑和智能手机模式下，标题和品牌都贴在页面顶部。

标签： csswordpress

Answer 1

3件事：

1. 您没有正确关闭媒体查询。
2. 您没有正确查询班级。

3. 请参阅 div 类的修订属性。我用红色突出显示它。

           @media only screen and (max-width: 1024px)
           {
   
           .mobile-header .mobile-site-header {
               background-image: url(https://odetomytravels.com/wp-content/uploads/2019/10/Header-2_1.gif);
               background-size: cover !important;
               background-position: center;
           } 
   
           .site-branding {
               border:5px solid red;
               position: fixed;
               top: 50%;
               left: 50%;
               transform: translate(-50%, -50%);
               }
           }