0

The website in question is www.grip.org.za/joomla/

The issue is that whenever I load one of the pages on the menu, the whole website moves to the right a bit, then back to the center/default location.

The template was built in Themeler, and is running Joomla 3.4.8.

If anyone has any ideas on what the problem could be, it would be much appreciated.

7
  • 1
    I've tested in Firefox, Chrome and Edge and it's working perfectly fine for me. Which browser/version are you using? How far would you say (in pixels) does the page move? Are you sure it's not simply due to the page's scrollbar becoming visible once all the page content is loaded (sometimes happens on slow computers/internet)?
    – Lodder
    Commented Feb 29, 2016 at 13:36
  • Hi Lodder, I have tested on Firefox, Chrome, and Edge, i have also tested on windows 10, Windows 7 and Mac OS X (Safari was tested here as well). I would say it is around 10px's that it moves. i was also looking at the scroll-bar that it could be the cause, but on my side the scroll-bar is one of the 1st things loaded on the page.
    – F3nrirX
    Commented Feb 29, 2016 at 13:40
  • Sorry forgot to mention that it does not happen every time you click on a page, its slightly temperamental.
    – F3nrirX
    Commented Feb 29, 2016 at 13:45
  • have you checked that you don't have a browser plugin on your machine for all those browsers? I've seen that happen from anti-virus, password-managers, and cookie blockers.
    – Lance
    Commented Feb 29, 2016 at 22:20
  • Agreed with @Lodder . CANNOT reproduce this issue in six browsers on Windows 7 32bit (PaleMoon 26.1, Firefox 44, Chrome 48, Safari 5.1.7, Opera 36, IE 11). From my own experience similar 'page jumps' happen due to some CSS selectors which are defined in first few css files and then overriden in last css file, so by the time last css gets loaded and changes applied, those overrides are visible. That happens usually only on first page load, subsequent page loads go from browser's cache, so those overrides are already active and jumps are not visible.
    – Mikan
    Commented Mar 1, 2016 at 11:01

1 Answer 1

1

I can reproduce it in Chrome 49. The page jumps slightly to the right on page load. It could relate to the scrollbar which pops up later. Only happens when the page loads relatively fast.

Captured it on 2 screenshots:

enter image description here

enter image description here

It's a known problem for centered web sites with different CSS hacks to fix that, for example force the scrollbars to appear always:

html {
   height: 100%;
   margin-bottom: 0.01em;
}

or

html {
    overflow-y: scroll; 
}

(Source: https://css-tricks.com/eliminate-jumps-in-horizontal-centering-by-forcing-a-scroll-bar/)

You also have errors in your HTML markup. I would fix these first.

1
  • Adding overflow-y: scroll; to my CSS has fixed the issue, thank you.
    – F3nrirX
    Commented Mar 14, 2016 at 12:18

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.