Re: Dawn theme 8.0.1 - burger menu break point

Dawn theme 8.0.1 - burger menu break point

SCHOIE1981
Excursionist
18 0 5

Why does the inspect screen show the hamburger showing at max 989px but people are coming to my site with 810 screens and seeing a mega menu on 2 lines??

 

Kind Regards,

Replies 3 (3)

Yeady123
Explorer
61 7 9

The reason why people with 810px screens are seeing a mega menu on two lines instead of the hamburger menu may be due to several factors, including:

  1. Browser zoom level: Users with smaller screens may have zoomed out their browser to fit more content on the screen, which can cause the hamburger menu to appear smaller than 989px.

  2. Device pixel density: Some devices have a higher pixel density than others, which can cause the website to render differently. For example, a 810px screen on a high-density display may appear smaller than the same size screen on a lower-density display.

  3. Different browsers: Different browsers may handle screen sizes and resolutions differently, which can affect how the website is displayed.

  4. Responsive design: The website's design may be responsive, meaning it adjusts to fit the screen size of the user's device. This can cause the hamburger menu to appear differently on different screen sizes.

To ensure that your website is displaying correctly for all users, you may want to consider using responsive design and testing your website on different devices and screen sizes. You can also use tools like Google's Mobile-Friendly Test to check if your website is mobile-friendly and displays correctly on different screen sizes.

 

- Was my reply helpful? Click "Like" to let me know!
- ----Was your question answered? Mark it as an Accepted Solution
You can get in touch with me via WhatsApp on +88013-13075440
Email: shahinkhan2424ft@gmail.com
SCHOIE1981
Excursionist
18 0 5

Thats what im doing now testing it on different screen sizes using sites like browser stack, is there a way to add some code to the base file to trigger it at say 1030px? anything below that and its a hamburger menu?!

Yeady123
Explorer
61 7 9

Yes, you can use CSS media queries to trigger the hamburger menu at a specific screen width. Here's an example:

/* Default styles for the menu */
.menu {
   /* Your menu styles here */
}

/* Media query for screens narrower than 1030px */
@media (max-width: 1029px) {
   /* Styles for the hamburger menu */
   .menu {
      /* Your hamburger menu styles here */
   }
}

In this example, the default menu styles will apply to screens wider than 1030px. However, when the screen width is 1029px or less, the styles for the hamburger menu will apply instead.

You can adjust the screen width in the max-width value to suit your needs. Keep in mind that different devices and browsers may handle screen sizes differently, so it's a good idea to test your website on multiple devices and screen sizes to ensure it works as expected.

- Was my reply helpful? Click "Like" to let me know!
- ----Was your question answered? Mark it as an Accepted Solution
You can get in touch with me via WhatsApp on +88013-13075440
Email: shahinkhan2424ft@gmail.com