Hi Ismael,

I mean by “switch”, that I could change the number of pixels from 1024 to 600px or 800px in the following command: “@media screen and (max-width: 1024px){.rob_menu, .rob_desktop {display:none!important;}”. I will try it in the next days, if I can borrow an Apple-IPad from my friend.

I set in the past already the “Header Mobile Menu activation to the first option”, but safari still hides elements (in this case an element with the class “rob_desktop”), which are defined in my style.css for screens bigger than 1024px, although the IPad has a wide screen (2048px x 1536px).

I think, my css-code seems to be OK, because on wide android tablets and all desktop-browsers there is no problem.

Best regards!

Robby

Hi Basilis,
hi Yigit,

I inserted your suggested code (#wrap_all {position: relative !important;}) in my child-css. But it doesn’t work. Safari shows only the mobile version of my website, although the IPad has a wide screen (2048px x 1536px). On wide android tablats there is no problem.

Do you have another suggestion?

I have no more ideas.

Best regards from Germany.

Robby

Hi Basilis,

OK. Sorry. In the future I will consider it.

Best regards from Germany.

Robby

Hi Kriesi-Team,

the described problem appears ONLY WITH SAFARI BROWSERS. I found now a not complete interim solution on one article in this forum
(https://kriesi.at/support/topic/toggle-menu-prolbems-within-safari-browser/#post-686014)

I added the following code to my css of the child theme:
@media only screen and (min-width: 1024px) {
ul#mobile-advanced {
width: 35%;
right: -40%;
}}

BUT WITH SAFARI THERE IS ONE ADDITIONAL PROBLEM I CAN’T SOLVE:
On big Apple tablets with wide screens safari hides elements, which I defined in my css only to hide on screen smaller than 1024px. You should know, that “.rob_menu” and “.rob_desktop” are classes from elements, I wanted to hide only on screens smaller than 1024px, BUT SAFARI HIDES IT ALWAYS:

@media screen and (max-width: 1024px){
.rob_menu, .rob_desktop {
display:none!important;
}

Do you have a solution? Please help.

Best regards!

Robby

Hi Josue,

great!!! Thank you very much. It works now. You can’t imagine, how happy I am. It was a big problem for me. Now I can start to build the website.

It would be excellent, if you could answer my two last questions:

1. Is there a command for all my pages / for all my page-ids, so that I need not specify all page-ids separate?
I mean something like all-pages #header {display:none!important;} and .all-pages #main {padding-top: 0 !important;}

2. I am sure, that I would find this solution for my problem very earlier and without disturbing or interrupting the great Kriesi-Team, if I could take look into a table or list, which contains ids or classes for all or the most elements of the enfold theme (like menu, footer, header, etc). I looked shortly into the documentation, but I did not find such a list. Maybe I overlooked it. -> Is it possible to provide this list of ids or classes for all elements of the enfold theme?

Thank you once again!!!

Best regards Robby

Hi Kriesi Team,

I tested the following proposal I read in your support area. It works, but only in one way, I do not need:

My goal was to scroll the “slide show element (fullwidth)” to the top and overwrite the whitespace, which appears after removing the main menu. Therfore I gave a classname to the “slide show element (fullwidth)” and scrolled it as a test in my style.css TO THE BOTTOM (command: .classname {margin-top: 400px;}). This works perfectly.

BUT WHEN I USE THE SAME COMMAND (command: .classname {margin-top: -400px;}) to scroll the “slide show element” to the TOP to overwrite the appeared whitespace, because the main menu is removed (hide). It does not work. Please consider, that I changed only the number from 400 to -400.

Why it is not possoble to overwrite the whitespace, which appears because of the removed or hided main manu?

By the way: I removed the main menu with the command: #header_main_alternate { display: none;} or .page-id-25 #header { display:none!important;} -> both commands worked.

Best regards.

Robby

Hi Josue,

Thanks for your respone. I posted you a link in the private content, but my site is still empty, becuse I am trying to test some menu possibilities.

My idea is to hide the complete header area and replace it with some avia layout architect elements. One of them would be your proposal with the FullWidth Submenu. But then I have some more problems:

1. If choose “Blank – No Header, no Footer” option for all pages and insert THE COMPLETE CONTENT for all pages with many several avia layout architect elements inclusive the the FullWidth Submenu
-> How I have to fix, that all avia layout architect elements will appear IN A BOXED LAYOUT WITH A MAXIMUM WIDTH OF 1000 px ?

2. If I do not choose “Blank – No Header, no Footer” option for all pages
-> How I have to hide the complete header area inclusive main menu and the Logo? (If I do so, does a whitespace appear instead?)
-> And how I have to adress particular items of the FullWidth Submenu to use my own css layout commands (because not all options are possible in the theme styling area (like height in px of the fullwidt submenu))

Please help!!!

Best regards

Robby