header { display: inline-flex; justify-content: center; background-color: #2b1411; height: 67px; width: 100%; position: fixed; z-index: 100; } header nav { display: inline-flex; justify-content: space-between; align-items: center; padding: 0 30px; } header nav > a { font-size: 30px; color: #fffccc; padding: 0 20px; } header .photo_header { margin-left: 70px; background: url("http://i.imgur.com/T8A8ReS.jpg") no-repeat center; width: 350px; padding: 0 1000px 0 0; margin: 0 0 0 -300px; } 
 <header> <div class="photo_header"></div> <nav> <a href="#home">HOME</a> <a href="#about">ABOUT</a> <a href="#explore">EXPLORE</a> <a href="#team">TEAM</a> <a href="#contacts">CONTACT</a> </nav> </header> 
Site header is not displayed in Microsoft Edge browser. In all other browsers displayed.

  • In chrome, the logo is not visible and part of the menu is hidden behind the right edge of the screen. i.gyazo.com/a0fdfde6f4f297927b9555253a91f0f2.png What should it look like? - Gleb Kemarsky
  • I'm just a sketch when filled. The bottom line is that in chrome and other browsers, the header is displayed (even if it is). And in the Edge, it is simply ignored by the browser, although it is visible in the code. - Tyler Maning
  • There is a hypothesis that the age reinforces the shortcomings of the existing code. It will be easier to help if this hypothesis is deleted. Please replace the code with a worker. To make it look great in all browsers and ignored by the age. - Gleb Kemarsky
  • Here the question is not about the form, but about visibility. Even such a header is normally displayed in all browsers, but in the edge it simply does not exist - Tyler Maning

1 answer 1

Good day! Checked your code in the browser Edge 25.1 Displayed like Chrome. I think that the first problem you have may lie in the logo. Your logo is loaded in size 4000x800px, and very strange indents are written.

 padding: 0 1000px 0 0; margin: 0 0 0 -300px; 

Try using a pre-scaled logo to start with and remove these indents.