skip to Main Content

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!

2

Answers


  1. 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.

    Login or Signup to reply.
  2. Check the path to your CSS file. your path to the CSS file might not be correct.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search