Home

Safari Overflow Hidden Problem

Created October 22, 2010

There may be times when you need to hide the overflow (scrollbars) being visible on a page. You can specify to have all scrollbars hidden or the x and y scroll bars separately. When trying to hide the overflow of a project I was working on I realized that the 'overflow:hidden' was not working on the Safari browser. This was very frustrating because it worked on all other browsers except Safari. Well, there is a very simple solution to solve this problem... All you have to do is set that element to have a relative position. For instance, if you were to specify for the body to hide the horizontal scrollbars you would want to have the following css in your stylesheet:

body {
	position:relative;
	overflow-x:hidden;
}

All ya have to do is set the position to relative! Hope this helps someone :)