Unwanted overflow and horizontal scroll

[cerstrand_mace]

I experience very annoying issues with a site I'm building. I've searched a great number of forums but haven't been able so solve it yet. The problem is easily discribed:The site generates an overflow of space to the right of the body witch causes an unwanted horizontal scrollbar. Most of the forums i've encountered suggest using this CSS: overflow-x: hidden; along with overflow-y: auto; I've tried all ways I can think of with this function but it just won't work the way I want it. Here's the site i'm working on: http://www.triwest.se/index-test.html Grateful for help! Thanks!

[dsonesuk]

   html {  	/*overflow-x: hidden;*/} #meny {  	float: right;	margin-right: 122px;	margin-top: 62px;	padding: 0;	position: relative;	text-align: right;	z-index: 1;}   #meny ul {  	float: left;	margin: 0;	padding: 0;}

a ul menu usually makes up a horizontal menu in one, not individual ul for each menu item,

   <ul>        <li><a href="index-test.html"><img width="111" height="36" src="bilder/om_oss-button.jpg"></a></li><!--closing of main li tag-->        <li><a href="#"><img width="111" height="36" src="bilder/mattor-button-A.jpg"></a>            <ul>                <li><a href="mattor_teknik.html"> Teknik </a></li>			    <li><a href="mattor_farger.html"> Färger </a></li>			    <li><a href="mattor_design.html"> Design </a></li>			    <li><a href="mattor_alternativ.html"> Alternativ </a></li>			    <li><a href="mattor_ekologiskt.html"> Ekologiskt </a></li>            </ul><!--closing of inner ul tag-->        </li><!--closing of main li tag-->        <li><a href="belysning.html"><img width="111" height="36" src="bilder/belysning-button.jpg"></a></li><!--closing of main li tag-->        <li><a href="referenser.html"><img width="111" height="36" src="bilder/referenser-button.jpg"></a></li><!--closing of main li tag-->        <li><a href="kontakt.html"><img width="111" height="36" src="bilder/kontakt-button.jpg"></a></li><!--closing of main li tag-->    </ul>

Edited November 27, 2012 by dsonesuk

[cerstrand_mace]

   html {  	/*overflow-x: hidden;*/} #meny {  	float: right;	margin-right: 122px;	margin-top: 62px;	padding: 0;	position: relative;	text-align: right;	z-index: 1;}   #meny ul {  	float: left;	margin: 0;	padding: 0;}

a ul menu usually makes up a horizontal menu in one, not individual ul for each menu item,

   <ul>		<li><a href="index-test.html"><img width="111" height="36" src="bilder/om_oss-button.jpg"></a></li><!--closing of main li tag--> 		<li><a href="#"><img width="111" height="36" src="bilder/mattor-button-A.jpg"></a>			<ul>				<li><a href="mattor_teknik.html"> Teknik </a></li>				<li><a href="mattor_farger.html"> Färger </a></li>				<li><a href="mattor_design.html"> Design </a></li>				<li><a href="mattor_alternativ.html"> Alternativ </a></li>				<li><a href="mattor_ekologiskt.html"> Ekologiskt </a></li>			</ul><!--closing of inner ul tag-->		</li><!--closing of main li tag--> 		<li><a href="belysning.html"><img width="111" height="36" src="bilder/belysning-button.jpg"></a></li><!--closing of main li tag--> 		<li><a href="referenser.html"><img width="111" height="36" src="bilder/referenser-button.jpg"></a></li><!--closing of main li tag--> 		<li><a href="kontakt.html"><img width="111" height="36" src="bilder/kontakt-button.jpg"></a></li><!--closing of main li tag-->	</ul>

That solved my problem perfectly! Now I understand what the problem was aswell.Thanks alot!