Hi,
I’m having trouble the elements within my header image responsive. As everything resizes for mobile portrait and landscape, I would like for my buttons to get smaller and remove the large image with my name in it. That should only be there for tablet and desktop view. Here’s a link to my read only site.
Okay, I’m looking at your site and a video won’t solve the issues displayed. Here are the initial problems:
We need to remove the header image & text out of that “Navbar” layer. You shouldn’t have that inside the navbar.
Inside that hero section there are numerous unnecessary divs. We need to remove all those and keep only two.
Your Nav & Header should all be separated and styled independently.
On the native navbar component, we need to remove that container layer. I know it comes standard in the navbar when you drag it in, but it’s not necessary when the site is using responsive full width. Containers are locked at max 960 pixels, if your using full width it won’t stretch. Just delete it.
Adding a new Navbar, you will only need to move the buttons on the right side with Typography right alignment. Don’t use display padding, margin or positioning settings for this, it will throw the hamburger menu off the page. That’s why you’re seeing it.
Honestly, I would start over and set up these layers correctly. It’s sort of an involved process. If you really need help I can do it for you. (I don’t mind) I would need your login details and I’ll fix it. It’s up to you.