[RESOLVED] Tweaks needed on my website

#native_company# #native_desc#

#native_cta#

This site is best viewed in a modern browser with JavaScript enabled.

jkd

Hi, I'm still a novice with CSS and can't figure out two things:

A couple pages on my website shifts to the right by 10px or so. I think it's somewhere in my CSS, but I can't find it. My html files are calling on a few CSS files, one that's mine (styles.css) and a few others that I got over the internet to plug in slideshow and responsive capabilities. You can see the shifts happening here:

www.keosaksith.com/index2.html

the index2.html, visual/index.html, and print/index.html pages don't shift when I click from one to the other. But if I click from one of these pages to contact/index.html or about/index.html, the page shifts to the right.

When you view my website on a mobile phone, the navigation in the masthead and the footer are not centered. I can't seem to get them centered. Any suggestions?

Thanks in advance!!

Funkiyo

I can give you a suggestion for your 1. problem. I believe it is because of your vertical scroll. The 3 pages you've mentioned have vertical scroll bar which is ~10px, and the contact page doesn't so it is 10 px wider than others

chriseccles

Hi Judy

First, meticulously go over your HTML to be certain that your
class and id assignments are consistent between pages.

That is the #1 reason why page alignments tend to shift.

Second, your CSS seems to be diversely scattered among a number
of style sheets. You need to integrate your styles into a single
document, if possible. This makes tracing class and id mismatches
and duplications very much easier.

Your main images are way too big at 300-400kB. Not everyone has
8Mbps+ broadband ! Use 'Save for Web and Devices' in Photoshop. You will
be surprised at how little detail is lost and the files will be 1/10th the size.

jkd

chriseccles - Thanks for the tips. I'm optimizing images now and will go back and check all class & ids. Will also integrate style sheets

chriseccles

Funkiyo;1258787 wrote:
I can give you a suggestion for your 1. problem. I believe it is because of your vertical scroll. The 3 pages you've mentioned have vertical scroll bar which is ~10px, and the contact page doesn't so it is 10 px wider than others

Interesting point, and scroll bars appearing on content would normally push
pages to the left, thus making the odd one out appear right-shifted.

10px is little narrow for a scroll bar, though.

I would tend to avoid scroll-able material if possible; end-users don't
generally care for it because mouse-wheels and arrow-keys tend to
move the page by default, not the scrolled content.

jkd

chriseccles;1258833 wrote:
Interesting point, and scroll bars appearing on content would normally push
pages to the left, thus making the odd one out appear right-shifted.

10px is little narrow for a scroll bar, though.

I would tend to avoid scroll-able material if possible; end-users don't
generally care for it because mouse-wheels and arrow-keys tend to
move the page by default, not the scrolled content.

C

Thank you both...it turned out that it indeed was the scroll bar that was making it look like the page was shifting.