I'm a bit stumped as I'm trying to make my mobile device headers using the Divi Builder and CSS Grid or Flex.
So far I'm trying to create the tablet version to have a three column style about it. The Left side of the header will be the logo, in the middle some header text and on the right will be the hamburger menu.
The problem I'm facing whether I use CSS Grid or Flex is that the header text and logo when the device size changes on browser it loses its position rather than sliding on a horizontal axis? Whereas my mobile hamburger menu follows an x-axis (Horizontal).
Is there any CSS that I am missing that will allow for me to have the logo and text be able to stay in the same position as the hamburger menu when scrolling through mobile device resolutions?
Here's the website I'm trying to create with Divi between resolutions @media all and (min-width: 768px) and (max-width: 980px) - http://new.launcestoncity.com.au/
Any help or discussion would be greatly appreciated. I'm sure such a question would have been asked before, but I didn't know what to type into a Google search to know what I'm looking at as best practice for such things.