Hi, tell me how to make in ipad Pro, what would the navbar become a burger?
I am not sure I understand your question, sorry.
How to make the menu in the ipad pro the same as in the ipad?
You will need to target a specific resolution in the custom code with media query and describe what you want to happen on that resolution. Here is a list of media queries for different types of ipad pros but the behaviour of the elements on those breakpoints depend on your design.
I do not understand how to do this, for this I ask you and ask
I have split your questions into separate topic. You should share your read-only link so that people can have a look at your project and propose solutions.
I created a pen the other day that should help you with the custom code.
Webflow menu toggle mobile for iPad Pro (portrait)
@webdev Thanks for sharing your codepen. Can you give specific instructions how to adapt it for our own project? Where do we paste it in Webflow? Do we paste the css only in custom code header area? Do we change the classes to match ours? I do not know much about code, as you can tell, and would appreciate specific steps. I am interested in using it to change my navigation menu from desktop view to iPad view on an iPadPro.
Here’s a link to my site, https://preview.webflow.com/preview/apostolic-faith?utm_medium=preview_link&utm_source=dashboard&utm_content=apostolic-faith&preview=01f85c0fbec2311a772c0b0f922292f1&mode=preview. Thank you in advance for your help.
I updated the pen with basic instructions. All the code is just CSS. CSS has to be wrapped with style blocks and placed on a page custom code or site wide in project settings.
@webdev Thank you very much. That worked. I am running into a different problem now. On the iPad Pro, the menu is in the middle when it should be aligned right. Does that have to be remedied with code?
Thanks so much for your help.
Since you are now using a custom breakpoint you need to handle any additional styling rules in the CSS inside that new media query. What specifically you need depends on what you want to accomplish. If you have no code experience I always suggest you stay within the nocode capabilities of Webflow and resist the temptation to extend it without resorting to hiring talent.
@webdev Thank you kindly for your reply. What I am trying to accomplish is to have the menu button float right when in iPadPro view vs being centered as it currently is. Can I accomplish this with no code? If so, can anyone share how to do that?
If not, it does sound like it can be accomplished with some css within the media query. I tried copying the css values of the menu button from the designer without success. And I also tried following the styling of the attached screen shot taken when webdev’s code pen was at iPad dimensions. Please see attached.
The code pen example does not have the third element, in my case, the sample button and search box (or
nav-right, in designer). I am hoping that the menu can look like this while in the iPad Pro view: Not like this as it currently does:
@QA_Brandon. Thank you.
Your positioning use of absolute is the nature of your problem. I would just move the div.menu-button-new to be a child of div.top-nav-content-block.social.nav after the a. button-example button. since it would then pick up the positioning of that element.
@webdev That worked! I didn’t fully understand your instructions but I changed the brand and nav button new to relative positioning from absolute and it worked! Thank you.