Css files is not loading at the browser

Hosting Support
1

I know there are numbers of people already asked this type of question but in my case the condition is different. I’m using css files from my domain to my subdomain.

My page:- https://forms.alapdorl.xyz/public/login

The problem is that when I’m opening my page in another browser or in incognito mode, browser didn’t caching my css files

When opening in another browser or incognito mode

but when I open my css files manually and then refreshing the page it is applying.

My page after opening css files manually

Here’s my Code

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"/>
    <meta http-equiv="X-UA-Compatible" content="ie=edge"/>
    <title>Login - Alapdorl</title>
    <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin>
    <meta name="msapplication-TileColor" content="#206bc4"/>
    <meta name="theme-color" content="#206bc4"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="mobile-web-app-capable" content="yes"/>
    <meta name="HandheldFriendly" content="True"/>
    <meta name="MobileOptimized" content="320"/>
    <meta name="robots" content="noindex,nofollow,noarchive"/>
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons"
rel="stylesheet">
    <link href="https://alapdorl.xyz/assets/css/tabler.css" rel="stylesheet"/>
    <link href="https://alapdorl.xyz/assets/css/demo.min.css" rel="stylesheet"/>
    <style> .separtor { display: flex; flex-direction: row; } .separtor:before, .separtor:after{ content: ""; flex: 1 1; border-bottom: 1px solid #dcdcdc; margin: auto; } .separtor:before { margin-right: 10px } .separtor:after { margin-left: 10px } </style>
  </head>
  <body class="antialiased">
     <div class="page" style="display:flex;justify-content:center;align-items:center">
               <div class="container">
          <div class="page-header" style="margin-top: -13%">
          <center>       
          <div class="col">
                <h1 class="page-title" style="font-size: 25px">Login</h1>
              </div>
            </center>
          </div>
       <div class="row justify-content-center">
       <div class="col">
              <form class="card card-lg" action="" method="post">
                <div class="card-body">
                <div class="mb-3">
  <label class="form-label">E-mail</label>
  <input type="email" class="form-control" name="email" placeholder="[email protected]" autocomplete="off" required/>
</div>
<div class="mb-3">
  <label class="form-label">Password</label>
  <div class="input-group input-group-flat">
  <input type="password" class="form-control" name="password" placeholder="•••••••" required/>
    <span class="input-group-text">
    <button class="material-icons" style="background:none;border:none;outline:none;font-size: 20px;color:inherit"> visibility </button>
    <button class="material-icons d-none" style="background:none;border:none;outline:none;font-size: 20px;color:inherit"> visibility_off </button>
    </span>
  </div>
</div>
<div class="form-footer"><button type="submit" class="btn btn-primary btn-block">Sign in</button></div>
<br>
                  <h5 class="separtor container">Or</h5>
<div class="form-footer"><a href="/login/index" class="btn btn-white btn-block"><img src="//alapdorl.xyz/assets/img/google_icon.png" height="20" style="float:left">&nbsp;Continue with Google</a></div>
                  </div>
                </form>
              </div>
            </div>
          </div>
        </div>    

       
    </body>
</html>

Sorry for bad indent :disappointed:

Update:-

Can I move my files to my subdomain

2

This is same person?

Same question.
Look like you already solved it.

1 Like