css - 自定义 CSS 以重新排列移动尺寸屏幕中的标题位置

Question

我正在使用 wordpress oceanwp 主题来创建我的电子商务网站。我在 m 网站上使用中等标题样式。但是，我希望我的手机屏幕显示不同的“最小”标题样式。

因此使用自定义 css 代码来解决此问题。但是，标题中的排列是( Logo /购物车图标/菜单)。但我期望的是将其位置重新排列为(菜单/ Logo /购物车图标)。

@media only screen and (max-width: 959px) {
.top-header-wrap.clr {
width: 50%;
}
.bottom-header-wrap.clr {
width: 50%;
}
div#site-header-inner {
display: flex;
}
.oceanwp-mobile-menu-icon.clr.mobile-right {
height: 100%;
line-height: 100px;
}
}

是否有任何CSS代码可以帮助我解决问题。我希望通过(菜单/ Logo /购物车图标)的排列获得我的移动尺寸屏幕的标题

谢谢!

Answer 1

你能不能把html代码发给他们现在怎么样

或

你必须这样写代码

.header{
    display: flex;
    align-items: center;
    justify-content: center;
}
.header div{margin:0 10%; text-align:center;}

<div class="header">
<div>menu</div>
<div>logo</div>
<div>Cart</div>
</div>