Website CSS Not Updating

Hello. Its my first time on this support forum but on my website my css file is not updating on the front end but in the back end it all looks correct.

This is my code as it appears to me on the back:
warning {
font-family: courier;
color: red;
font-size: 120%;
}
a.links {
font-family: times;
color: red;
font-size: 120%;
text-decoration: none;
}
div.linkscase {
border: 2px solid black;
width: 305px;
}
div.home {
font-family: courier;
color: black;
font-size: 200%;
text-align: center;
align-items: center;
justify-content: center;
}
h1 {
font-family: courier;
}
h2 {
font-family: courier;
}
p {
font-family: courier;
}
a {
font-family: courier;
color: black;
font-size: 100%;
}
And this is it as it appears on the front:
warning {
font-family: courier;
color: red;
font-size: 120%;
}
a.links {
font-family: times;
color: red;
font-size: 120%;
text-decoration: none;
}
div.linkscase {
border: 2px solid black;
width: 305px;
}
h1 {
font-family: courier;
}
h2 {
font-family: courier;
}
p {
font-family: courier;
}

The website is marsbattleking.com and the style sheet is found at marsbattleking.com/styles_main.css

It’s cache problem, better to force load new .css version of a file like that:

Before:
<link rel="stylesheet" href="https://example.com/style.css">
After:
<link rel="stylesheet" href="https://example.com/style.css?v=1">

You can use php like
<link rel="stylesheet" href="https://example.com/style.css?v=<? echo time(); ?>">
to always load last version.

Also you can clear your cache or use cloudflare purge option/developer mode.

@MrJunior said:
It’s cache problem, better to force load new .css version of a file like that:

Before:
<link rel="stylesheet" href="https://example.com/style.css">
After:
<link rel="stylesheet" href="https://example.com/style.css?v=1">

You can use php like
<link rel="stylesheet" href="https://example.com/style.css?v=<? echo time(); ?>">
to always load last version.

Also you can clear your cache or use cloudflare purge option/developer mode.

Exactly, Cloudflare is the “issue” here. Cloudflare helps speed up websites and reduce account resource usage primarily with caching. Caching ensures your CSS files are available on Cloudflare’s network all over the world, so they can be sent directly to your visitors. The downside of cache is that any changes take longer to be visible everywhere.

Purging Cloudflare’s cache after making a change is useful. If you need to make a lot of changes at once, enable Developer mode. I highly recommend against using the suffixes on your CSS links, as it will make your website slower and use more server power (and essentially eliminate the benefit of Cloudflare).

Thanks I am new to using Cloudflare and that helps a lot!