CODEWITHSUNDEEP
cssservercpanelnamecheap
Gloria Chen
Gloria Chen

Reputation: 73

CSS works in Safari in local, but does not work in Safari after I upload the code to cPanel

I have uploaded all the files to my web server (I use NameCheap, cPanel). This is my webpage: www.gloriachen.me

In the landing page, my html and css are:

<!-- Landing Page -->
<div class="container-fluid">
    <img src="assets/landing-page.JPG" class="img-fluid" alt="Responsive image" style="width:100%;">
    <div class="top-left">
        <p> <span>Hi, </span>I am Gloria Chen. I am currently a recent graduate from Australian National University (ANU) 
            with a master’s degree in computer science. As an enthusiastic fan of front-end development 
            at the moment, I am keen to look for a job on Web/App front-end development.
        </p>
        <p> This is my personal blog website. Initially I developed this site for practicing my 
            front-end skills, especially in programming. I used HTML, CSS, BootStrap 4, JavaScript 
            as the main languages for building my site, and would like to use Vue.js or Angular.js 
            for front-end framework building.
        </p>
        <p> It’s not easy for me to look for jobs right now at the moment, one reason is because 
            I just finished a surgery of a chest wall tumour removal on this September. For almost 
            about one and a half month, I was in the process of recovering from the treatment and 
            procedure. Luckily, my pathology report of the removed tumour is positive, which means 
            I can still be alive :). I thank God for his preserving. But now I really need to gradually 
            restore my mind, emotion, will and motivation, and really devote myself into working again.
        </p>
        <p> Things are not always easy, but I believe I will get a suitable one soon :) </p>
    </div>
</div>

/* Text CSS */
.container {
    position: relative;
    text-align: center;
    color: white;
  }

.top-left{
    width: 50%;
    position: absolute;
    top: 150px;
    left: 70px;
    line-height: 2;
}

The text is supposed to be on the top of the image. I tried on my local, and it was successful, like this:

enter image description here After I upload all my files to the NameCheap cPanel. However, it doesn't work in Safari. If I open the site using Safari, the text won't be on the top of the image. The landing page would be like this:

enter image description here

Anyone knows what is the reason of it and how can I solve the problem here?

Thanks in advance!

Upvotes: 0

Views: 336

Answers (2)

Asad Mehmood
Asad Mehmood

Reputation: 342

Check the path to your CSS file. your path to the CSS file might not be correct.

Upvotes: 0

Alex
Alex

Reputation: 328

It looks correct for me when clicking your click.

Try clearing your browser cache, or holding Shift while clicking the refresh button to perform a hard-refresh, which should force new css to load.

Upvotes: 1

Related Questions