I am having a bit of an odd problem that I have never experienced before. I have checked the net and asked someone but could not find the answer. When I work on my website and publish it, the CSS will not update unless I put a ?vh=1 at the end of the CSS links. The site
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../dist/css/main.css?vh=1.5">
<link rel="stylesheet" media="screen and (max-width: 819px)" href="../dist/css/_tablet/index-tablet.css?vh=1.2">
<link rel="stylesheet" media="screen and (max-width: 414px)" href="../dist/css/_mobile/index-mobile.css?vh=1.7">
<link rel="icon" href="../assets/images/quorum_favicon.svg" type="image/gif" sizes="16x16">
<title>Quorum / Home</title>
</head>
Here's an example of what the head looks like on all my pages. I am working on the responsiveness and what I have to do every time is change the number after the ?vh= and it's slowing down my workflow super fast. I won't even know which link I have to change either so I am spending more time figuring that out than actually styling the site. Is this normal to happen?
EDIT: I also wanted to mention I have cleared the cache several times and done hard refreshes so that has not worked either.
Cloudflare (what you are using) has a server side cache as well, see https://support.cloudflare.com/hc/en-us/articles/202775670-Customizing-Cloudflare-s-cache. Clearing the client side cache in your browser has no affect on the server side cache used by cloudflare. Specially check https://support.cloudflare.com/hc/en-us/articles/200172516#h_a01982d4-d5b6-4744-bb9b-a71da62c160a to see that CSS files are cached. Configure your cloudflare application/installation/host to change the caching settings in a way you like.