Return to previous page

Mobile Device Sticky Header - by aahmadi3

This topic has 11 replies, 3 voices, and was last updated 7 years, 5 months ago ago by Laranz

aahmadi3

Participant

June 7, 2017 at 18:27

Hello,
My logo and shopping card icons don’t look right after the update on mobile devices while in the sticky header. Please see screenshot here and let me know how to fix this, I have tried all kinds of css changes but nothing seems to control this: https://www.puredogfood.com/Newsletter/sticky_header.png
Thanks.
Ali

#165241 Copied Theme version: 3.2 WooCommerce version: 3.0.8

10 Answers

Rose Tyler

Support staff

June 8, 2017 at 08:54

Hello,

You need change or delete this custom code in your Custom css http://prntscr.com/fhahtm

Regards,
Rose Tyler.

#165265 Copied

aahmadi3

Participant

June 9, 2017 at 18:28

Hi Rose,
That did not work, please see the new code in your css.
Also note that this is for the sticky header not the regular header.
Thanks.
Ali

#165436 Copied

aahmadi3

Participant

June 9, 2017 at 18:30

My apologies, that did work but now my logo is squished and distorted…how do I fix this?

#165437 Copied

Laranz

Participant

June 10, 2017 at 14:47

Hi,

The sticky logo looks good, Screenshot: http://take.ms/eaMc2 Can you tell us in which browser you saw the distorted logo, make sure you clear your browser cache before trying. Also the site is locked with sitelock, please unlock it until the issue is fixed, so that we can check in all browsers.

Let us know,

Thanks,
laranz.

#165451 Copied

aahmadi3

Participant

June 10, 2017 at 18:24

I wish your team would read the entire post before posting a reply. This topic is title “MOBILE DEVICE STIKY HEADER” not desktop which Laranz provided a screenshot to. Please read carefully and provide an answer!

#165454 Copied

Laranz

Participant

June 11, 2017 at 01:51

Hi,

I apologies for my mistake, can you turn the sitelock off, so that I can check in mobile and reply you back, for now I get error like this when visiting. Screenshot: http://take.ms/nF5NT

Let us know,

Thanks,
laranz.

#165457 Copied

aahmadi3

Participant

June 11, 2017 at 02:13

Ok your IP has been white listed.

#165458 Copied

Laranz

Participant

June 11, 2017 at 04:12

Hi,

Can you try remove the height you set for the sticky header logo in the custom.css file, http://take.ms/GDpQu that height makes the logo squashed.

Let us know,

Thanks,
laranz.

#165460 Copied

aahmadi3

Participant

June 11, 2017 at 04:41

When this change is made it affects the desktop version of the sticky header. I don’t want that to be affected, please provide a better solution. It seems that both the desktop and mobile version of the sticky logo share the same code…

#165461 Copied
Laranz

Participant

June 11, 2017 at 07:37
Hi,

You can try targetting using the media queries like you did before in that case, for example,
```
@media only screen 
  and (max-width: 480px) {
    
}
```
This will do things for mobile alone.

Let us know,

Thanks,
laranz.
#165465 Copied
Viewing 11 results - 1 through 11 (of 11 total)