Return to previous page

Can’t set different header padding values on different devices.

This topic has 6 replies, 2 voices, and was last updated 8 months, 2 weeks ago ago by Rose Tyler

lanxiaodj

Participant

August 27, 2023 at 04:11

It just comes a problem on my header paddings. After I set a value of the header padding on desktop, I switched to mobile status and set a different value, and then I switched back to desktop side, and the value changed to the one on the mobile side. Whatever value I set on one side, the other side keeps the same. They seem unified, and cannot be set differently.

How to fix this problem?

#365768 Copied Theme version: 9.1.13

5 Answers

Rose Tyler

Support staff

August 27, 2023 at 07:31

Hello, Lanxiaodj,

Thank you for contacting us and for using XStore.

There are no separate padding settings via Computed Box for desktop and mobile, it is not a bug but a predefined behavior.

You can try to use vw unit https://www.w3schools.com/cssref/css_units.php , or custom CSS code.

Provide URL of your site, describe the desired result in more detail and we will be able to give you custom CSS code.

Thank you for your cooperation and we look forward to hearing from you soon.

Kind Regards,
8theme team

#365783 Copied

lanxiaodj

Participant

August 27, 2023 at 07:49

What I want is to set a main header a padding on left and right like 50px on desktop, while on mobile side 10px.

Cause when it’s on desktop, the menu is too close to the left and the login icon is too close to the right.

Please contact administrator
for this information.

#365785 Copied

Rose Tyler

Support staff

August 27, 2023 at 08:26

Hello, Lanxiaodj,

Could you provide temporary wp-admin access?

To provide wp-admin access, you can create a new user account with administrator role via the Dashboard, and provide us with the username and password via the Private Content area.

Kind Regards,
8theme team

#365786 Copied

lanxiaodj

Participant

August 27, 2023 at 08:46

Is the solution CSS code based? If it is, please pass the code to me that I can change the value accrodingly instaed of having you set it up at the particular figures.

#365788 Copied
Rose Tyler

Support staff

August 27, 2023 at 08:53
Hello, Lanxiaodj,

“What I want is to set a main header a padding on left and right like 50px on deskto” – please set it via Header Builder, then add the next code in Theme Custom CSS > Mobile:
```
.mobile-header-wrapper .header-main {
    padding: 0px 10px;
}
```
Kind Regards,
8theme team
#365789 Copied
Tagged: customize woocommerce themes, different devices, header padding, responsive woocommerce templates, woocommerce, wordpress themes
Viewing 6 results - 1 through 6 (of 6 total)