/    Sign up×
Community /Pin to ProfileBookmark

My site consists of pages that require the use of the vertical scroll bar, along with pages that do not require a scroll bar. When navigating through the site (in Firefox) i have noticed that when i move from one page to another page that requires a scroll bar the site indents to the left when a scroll bar is needed. Then if i move from that page to a page that doesn’t require a scroll bar, the site moves over a little to the right as soon as the scroll bar disappears. If i view the site in IE everything is fine because a vertical scroll bar is always present but is not always enabled. This is a small problem but it creates eye sore when navigating through the site. Does anyone know a fix around.

THANKS IN ADVANCE

to post a comment
CSS

1 Comments(s)

Copy linkTweet thisAlerts:
@WebJoelJan 11.2007 — That is because Mozilla adds the width of the scrollbar to the width of the container. Basically, it is adding about 20-pixels to your width. A partial solution I guess would be to identify any container that will not need scrollbars, and increase it's width by 20-pixels. This is actually 'correct behaviour', -even though it seems counter-intuitive. IE incorrectly handles this (with pleasing effect). I suppose a possible fix for this would be to exactly position the left-edge of the container, and let any 'overflow' of scrollbar be to the right. It would be slightly less noticeable that way, as the actual 'content' of the container would not be jumping 20-pixels..
×

Success!

Help @oo7ml spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.25,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...