Css file not loading correctly

i loaded to the file maneger an css file with classes like this

.up {height: auto;color: orange;font: bold;font-size: 35px;text-align: center;font-family: ‘Segoe UI’, Tahoma, Geneva, Verdana, sans-serif;}

with the “.” at the start, but when the website is loaded the “.” is changed to “#” and the styles are not loaded for the elements that have the same name class that are in css file.

what could i do for resolve this?

Describe clearly your current situation.
What is the website link that is causing this issue?

5 Likes

in the css file:

.up {height: auto;color: orange;font: bold;font-size: 35px;text-align: center;font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;}
.up2 {height: auto;color: orange;font: bold;font-size: 30px;text-align:center;font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;}
.form
{
    width: 800px;height: auto;
    color: white;font: bold;font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; font-size: 20px; 
    margin: auto;margin-top: 100px;
    padding: 50px;
    align-items: center;
    text-align: center;
    border: solid 2px orange;
    border-radius: 4px;        
}
in the web:

#up {height: auto;color: orange;font: bold;font-size: 35px;text-align: center;font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;}
#up2 {height: auto;color: orange;font: bold;font-size: 30px;text-align:center;font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;}
#form
{
    width: 800px;height: auto;
    color: white;font: bold;font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; font-size: 20px; 
    margin: auto;margin-top: 100px;
    padding: 50px;
    align-items: center;
    text-align: center;
    border: solid 1px orange;
    border-radius: 4px;        
}

http://testecc.infy.uk/

Is this correct?

5 Likes

I’m getting the same results as KangJL

Possibly a silly question but what browser are you viewing it on? and have you tried using an incognito window to make usre there isn’t a plugin thats causing the problem?

1 Like

Apparently @pereiragtiagos wasn’t lying about his/her problem on CSS. I checked the CSS file and I could confirm that there were some mistakes in CSS that resulted to errors in the design.

This is what it should look like:

The header portion was missing due to the mistakes in the CSS.

“up” and “up2” are legitimate HTML classes.

The dots were missing in front of each problematic class definition.

The style definitions for up and up2 classes were mistakenly interpreted as style definitions for up and up2 HTML elements. That’s why the styles for <h1 class="up"> ... </h2> and <h2 class="up2"> ... </h2> were not applied. The CSS assumes that the styles are dedicated for <up> ... </up> and <up2> ... </up2> HTML elements.
Screenshot_2025-01-23_01-20-10


Before modification:

After modification:

6 Likes

This is strange, could it be that the files are in some format other than UTF8 ?

The server only supports UTF8 encoded files and possibly characters are being altered after the upload ?

This is a long shot, I couldn’t think of a good reason for this issue

2 Likes

@pereiragtiago if possible could you upload your css file here using the upload link or upload it on google drive and share the link so I can examine it ?

Thanks

5 Likes

i restarted and a made an new website, and the css file was submitted correctly.

1 Like

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.