Joomla not always displaying webpage correctly

Question

so my problem with my webpage NerdyFuture is that it does not display it correctly on the web. On my localhost the page looks fine. Strangly when i put it on the web it looks fine first but after a while the position changes. Does anyone know how to fix this?

How the page should look like (localhost):

Answer 1

You're not giving enough information, after a while the position changes is not very helpful.

Here's a couple of common reasons for layout errors:

1. Make sure you've transferred all your files to the server. If possible, use Akeeba Backup and Kickstart.

2. Make sure you've included your custom CSS files properly. Take a look at this post for a couple of alternatives. I don't know if you have a custom.css file, but if you do, it's not loaded in your source code. These are the CSS files I could see in your source code:

   <link rel="stylesheet" href="/templates/protostar/css/Header.css" type="text/css" />
   <link rel="stylesheet" href="/templates/protostar/css/Bootstrap.css" type="text/css" />
   <link rel="stylesheet" href="/templates/protostar/css/Latest-Articles.css" type="text/css" />
   <link rel="stylesheet" href="/templates/protostar/css/Top-Articles.css" type="text/css" />
   <link rel="stylesheet" href="/templates/protostar/css/template.css" type="text/css" />
   

   (the rest are extension specific)

3. Make sure your code contains no absolute paths to http://localhost or relative paths that aren't valid on your live server.

4. Clear both your browsers cache and Joomla cache.

Answer 2

Found the problem. I use Google Chrome development tools a lot so I can easily assign values to properties. what I did is just copy/paste the CSS code from Chrome to the appropriate CSS file. Turns out to be that The development tools assign a wrong class or/and id. Changed some classes and everything works fine now