DaddyG Posted June 29, 2021 Posted June 29, 2021 Site URL: https://www.amparo.world/home-en The desktop version of my site works well, however the mobile site navigation has some item display issues that I cannot seem solve: Some Folder items do not show at all (e.g. 'PRODUKTE') This is only on some folders for some reason Folder items (again, only some???) display horizontally without any clear form of separation (e.g 'PRODUCTS'). I want them to display vertically/ as a single column I managed to fix this on my desktop site with this CSS (doesn't work for mobile): .Header-nav-folder-item { height: unset !important; width: unset !important; display: flex !important; flex-direction: column; } Can anyone advise me on why this might be - or even better provide me with a work around 🙂 Would really appreciate any help FYI: these irregularities do not show on desktop mobile previews (on chrome at least), and to see them you need to see the site on a phone Useful info about the menu/nav: The website is in 2 languages, and to solve this someone put some code to only display menu/nav items if the url linked ends in either -en or -de (English or German). this works well on desktop (although not ideal) and I am not looking to change it at the moment. However it would be great to know how to get it to work on mobile as well, as it does not work on mobile. the code for that is here: <script> window.onload = function() { if(window.location.pathname == '/') { return; } var // pattern = /-(en|de)\/?#?.*$/, pattern = /-(en|de)\/?(#.+)?$/i, lang = window.location.pathname.match(pattern)[1], links = document.getElementsByTagName('a'), langPattern = new RegExp('-' + lang + '\/?(#.+)?$', 'i') ; for(var i = 0; i < links.length; i++) { var link = links[i]; if(/amparo\.world/.test(link.href) && pattern.test(link.href)) { link.style.display = langPattern.test(link.href) ? 'inline' : 'none'; } } }; </script>
Recommended Posts
Archived
This topic is now archived and is closed to further replies.