Site design not rendering the same in all browsers

[tsjohns9 (Trevor)]

Hi, so I have made this website and I don’t understand why it isn’t displaying correctly in firefox and microsoft edge. Also, my banner image is set to fixed, but it does not display fixed in chrome, but it does in firefox. I could also use some help in getting the clover image to be displayed as the background image on the body. Right now it is displayed in a div that is set to fixed, full screen height, and z-index of -1. Setting it to fixed on the body does not work. If someone could help me solve this I would appreciate it. Thank you

Here is a link to the published site: http://mountain-view-pub.webflow.io/
And a link to my profile so you can see the site in the designer: https://webflow.com/website/mountain-view-pub

Here are the bugs showing up in firefox. The images are not the right size or located correctly.

The bug here is that there is not enough padding above and below my paragraph.

And the same thing here above the form.

Here is a screenshot of the problem in edge. When I scroll the image doesn’t stay fixed and it creates a white space, and then re-positions itself.

[cyberdave (Dave S.)]

hi @tsjohns9, sorry to hear about the rendering issues, those can be tricky sometimes. I took a look in Firefox and this is what I see on those image layouts in issue #1:

https://cl.ly/3I0i1A0V3l02/Image%202017-04-25%20at%2011.53.20%20AM.public.png

The spacing between the paragraphs looks like Firefox is not rendering the 3% padding you are using for top and bottom. Changing this to a px based value, say 20px should do the trick:

https://cl.ly/0P1M2Z311u3r/Image%202017-04-25%20at%2011.57.23%20AM.public.png

Regarding Edge, I am helping to check on that still.

I hope this helps.

[tsjohns9 (Trevor)]

Thanks @cyberdave, here is that link to my site
https://preview.webflow.com/preview/mountain-view-pub?preview=b2ee75809165d816722862875898f940