Really strange behavior. Browser not reading CSS on one element

Hi, Im having some difficulties.
@Waldo, do you have any idea what this could be? :slight_smile:

On this site: saeteraasenmaskin.no you can see on the middle of the page that there are some text all the way out to the left.

On the webflow hosting version, every thing is fine: http://saeteraasenmaskin2016.webflow.io/

Share link: https://preview.webflow.com/preview/saeteraasenmaskin2016?preview=6120efb5c861b1a6a55249c9fa51a617

Any idea what is going on?

Im using FileZilla to upload to server. Never had any problems.

This is how Console looks. Just no codes.

The CSS file that is uploades contains this info for that element.

.index-service-stopdigging {
display: none;
height: 330px;
max-width: 900px;
margin-top: 100px;
margin-right: auto;
margin-left: auto;
padding-top: 24px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
background-image: -webkit-linear-gradient(270deg, rgba(0, 0, 0, .2), rgba(0, 0, 0, .2)), url(‘…/images/stopdigging.jpg’);
background-image: linear-gradient(180deg, rgba(0, 0, 0, .2), rgba(0, 0, 0, .2)), url(‘…/images/stopdigging.jpg’);
background-position: 0px 0px, 50% 50%;
background-size: auto, cover;
text-align: center;
}

.index-stopdigging-header {
margin-top: 0px;
color: #fff;
font-size: 80px;
line-height: 1.2em;
letter-spacing: 2px;
}

.index-stopdigging-subheader {
margin-top: 15px;
color: #fff;
font-size: 30px;
letter-spacing: 1px;
}

.index-stopdigging-toptext {
margin-bottom: 15px;
color: #fff;
letter-spacing: 2px;
text-transform: uppercase;
}

.index-stopdigging-btn {
margin-top: 40px;
border: 4px solid #fff;
background-color: transparent;
-webkit-transition: background-color 200ms ease, color 200ms ease;
transition: background-color 200ms ease, color 200ms ease;
text-transform: uppercase;
}

.index-stopdigging-btn:hover {
background-color: #fff;
color: #333;
}

I can’t seem to reproduce your issue:

http://vincent.polenordstudio.fr/snap/y8e4x.jpg

that’s what I see in Chrome on saeteraasenmaskin.no

Same as on .io

http://vincent.polenordstudio.fr/snap/hz62n.jpg

Had to start hosting through webflow. Couldn’t have it look like a mess :slight_smile:
i think maybe it was filezilla, but then again, when i downloaded css file
from the server it looked fine. Chrome just wouldn’t read it. Really
strange but all good now. And webflow is earning more money :stuck_out_tongue:

Vennlig Hilsen
Kjell Ruben

1 Like