1

Hi I am using Bootstrap to design a 'Site Maintenance' page.

I am using the 'Spinning Icon Font' to display the spinning gears. While this works very fine on my local XAMPP server, it is not showing when I upload it to online server.

Should be:

enter image description here

But it is showing as

enter image description here

However those rectangular frames shown in the second pic are spinning, but it is not showing the gears.

My index.html

<!DOCTYPE html>
<head>

  <title>Maintenance</title>

  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="description" content="">
  <meta name="author" content="">

  <!-- Google Font -->
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,800,800italic">
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Oswald:400,300,700">

  <!-- Font Awesome CSS -->
  <link rel="stylesheet" href="/css/font-awesome.min.css">

  <!-- Bootstrap CSS -->
  <link rel="stylesheet" href="/css/bootstrap.min.css">

  <!-- App CSS -->
  <link rel="stylesheet" href="/css/admin.css">

</head>

<body class="">

<div class="maintenance-wrapper">

  <div class="maintenance">

    <div class="maintenance-icon">
      <i class="fa fa-cog fa-spin gear-1"></i>
      <i class="fa fa-cog fa-spin gear-2 text-primary"></i>
      <i class="fa fa-cog fa-spin gear-3 text-secondary"></i>
    </div>  <!-- /.The Spinning-icons -->

    <h1 class="maintenance-title">Site Maintenance</h1>

</body>
</html>

Where am I doing wrong?

Live example can be see at http://vikramrao.com

3

2 Answers 2

1

"font-awesome.min.css" is trying to load fonts from:

http://vikramrao.com/fonts/

so:

Don't exists, it throws 404 error (not found)

You should create this folder and upload this files.

0
0

I saw your code structure and found that you provided improper path for font in stylesheet. See my screen capture Screenshot

3
  • The issue is already resolved. However thanks for taking time to reply nicely in detail.
    – Vikram Rao
    Oct 13, 2017 at 8:05
  • Is there any votes for it? Because I saw that someone is down voted my answer. Oct 13, 2017 at 8:08
  • I am sorry but I do not have the capability to tell you as to who voted you down. That needs way much more reputation points.
    – Vikram Rao
    Oct 14, 2017 at 15:45

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.