I have some problems with the responsive headers and different problems in Chrome and Explorer.
In chrome, the logo-element gets smaller, but the menu does not seem to adapt anything.
In internet explorer, the logo-element does not respond, and the menu doesn’t either, so the menu lies over the logo.
I am using the pro version, and I have tried so many different things. I hope someone can tell me what I am doing wrong!
This is an automated message to notify you that your thread was posted in the wrong forum, and it has been moved to the correct place. A member of our team will be happy to reply just as soon as your thread is up. How support works.
For support, please post all questions in the Support Forum.
For peer to peer conversations with other Themeco customers about tips, customizations, or suggestions you are welcome to use the Peer to Peer (no official support provided here).
For Design & Development, Marketing & Media, and Hosting & Optimization discussions you are welcome to use the General Forum to discuss with fellow Apex members about non Themeco related topics. Please keep this in mind in the future.
Thank-you!
Hi there,
Thanks for posting in.
Please provide your site’s URL, we need to check what’s happening. You may provide it in a secure note if you don’t wish to make it public.
And for the meantime, please make sure your theme is updated.
Thanks!
I have the same problem with the card in cornerstone. Works perfectly in Chrome, and not at all in explorer. I have looked at several support-forums that they are told to update to the newest version, 5.1.1. I have 1.1.1, and both in “automatic update box” in my admin panel, and in my account her at apex, it says I have the latest version?
Hi there,
I see it differently, what overlaps in my view is the menu and the cart button. The logo is okay and it switches to different logo when viewed in a smaller device.
Or perhaps it’s already solved?
Thanks!
No, it’s the same problem, but it acts differently. I want all of the header to be responsive. Not just parts of it. And it’s not only the cart that lays over, but the menu buttons to the right do not show at all now.
I have managed to fix some of the issues, exept now the menu text does not shrink, but gets “under” the line i chrome:
but in explorer it does this and lays on top of logo.
I also have a problem with the card acting different in chrome and explorer. Works perfect in chrome, and not at all in explorer:
Hi there,
In that screenshot, your menu should already turn to mobile menu. You shouldn’t force an inline menu especially when it’s too long. The inline menu is for the larger screen, and the mobile menu is for smaller.
In your screenshot, it’s about 1000px width (minus the edges and scroll bar so it’s probably 970px).
Please hide you inline menu on that size using visibility options under customize section when you inspect your element. Then simply hide the mobile menu on your desktop.
You can also use browser developer tools and find the width of your menu and logo, and add them. You’ll see that the total width is not applicable for the smaller device. You may also need to remove some menu items if you wish to retain inline menu even on the smaller device.
Thanks!
Hi. The width of 1000 px is only because I had to crop the image to make it small enough to post it here. I have a navigation collapse for ipad and smaller, and it works perfectly. It is the sizes between full screen and ipad that does not work. And that still does not answere why it acts differently in different browsers.
Hi There,
I can see the issue. Your current normal desktop inline menu together will all other content on the bar will only fit nicely on 1280px screen width and up. See this: https://screencast-o-matic.com/watch/cbQXiQIlOf. Let’s compare with other browsers here: https://screencast-o-matic.com/watch/cbQXioIlO2
Hope this helps.
So there is not possible for the text in the header to shrink to adapt a smaller size?
Hi There,
That could be done with CSS, but you will achieve the same results by hiding the inline bar for desktop and add another one with smaller fonts for the smaller screen widths.
Hope it helps
Okey, then I know. But I haven’t gotten an answere for my question about the card acting differently on different browsers.
Hey There,
Would you mind providing us with login credentials so we can take a closer look? Please provide following information:
Set it as Secure Note
All the best!
The information is here:
Hi there,
I’m here again:slight_smile:
About the 1000px, I’m not saying it’s the cause of the issue, but I’m suggesting to minimize the items on your menu for that size. And I don’t think you cropped the width( cropped height, yes) because it shows browser edges and the scroll bar has the same size on my end. Hence, the browser is resized and not cropped. My Recommendation is still the same, please minimize you menu items to accommodate that width. Or yes, with the CSS, please add this CSS to your global custom CSS
.hm14.x-menu > li > .x-anchor .x-anchor-text-primary, .hm15.x-menu > li > .x-anchor .x-anchor-text-primary {
font-size: 0.8vw;
}
Sorry about the card, I don’t remember seeing that especially the screenshot. Are you testing it on IE11? Because it’s a known issue in IE due to not fully supported 3d transform effect through CSS. Please setup your card again and I’ll check, I could provide CSS workaround but it’s only applicable for that specific setup (card size, content, etc). Right now, they are just images.
Thanks!
The card is at the bottom of the frontpage. It works perfectly in Chrome, but not in IE11, as you said. If you can help me, it would be great.
http://postkasse.no.loopiadns.com/
Hi again,
To fix the issue in IE11, just add the following code in your Customizer via Appearance > Customize > Custom > Edit Global CSS:
.x-card-outer.flipped .x-face-outer.back {
background: #fff !important;
}
Let us know how this goes!
it is better, but it is still not working as it should. Now they lay on top of eachother, and the picture dissapear on hover:
http://postkasse.no.loopiadns.com/