CODEWITHSUNDEEP
htmlcssinternet-explorermicrosoft-edge
EWP
EWP

Reputation: 11

Menu buttons not aligning in Edge browser

The page in question is here: http://dev.psdrotoworx.com/

When viewed in Edge, the menu buttons are rendering wider than they should. This causes the buttons to wrap into a new row, which is undesired behaviour. Like so:

Edge incorrect rendering screenshot

This issue is only appearing on the Edge browser, all other modern browsers are rendering as expected, which is like so:

IE11 correct rendering screenshot

Is anyone able to see where I am going wrong?

Can anyone explain why IE & Edge handles this differently?

Upvotes: 0

Views: 189

Answers (1)

Etienne Margraff
Etienne Margraff

Reputation: 711

I did not get deep into your code but I think adding this:

width: 100px;

To your .main-navigation .primary-menu > li class in the style.css file might do the trick (somewhere around line 2975).

Having fixed size here is not a big issue as I guess the menu do not have to respond to browser size changes.

Upvotes: 1

Related Questions