Hello,

Sorry unsure on how to explain this properly...

But say i have a div and i only want 5 sections in there and have this fixed on the page so you cant scroll past it...

How would i make it so that each section is separated equally depending on the size of the browser, of course having a min-width....

So try saying it again section 1 always touching the top of browser windows, section 5 always touching bottom of the browser windows, so margin auto changing between the sections...

Just what i got if you wanna add to it...

Code:
<div id="container">
<div id="test">
					<section>
						<hgroup>
							<h2> Steel </h2>
						</hgroup>
						<p> Te bla is cool </p>
					</section>
					<hr />
					<section>
						<hgroup>
							<h2> Plastic </h2>
						</hgroup>
						<p> always cool c word! </p>
					</section>
					<hr />
					<section>
						<hgroup>
							<h2> Orange </h2>
						</hgroup>
						<p> yes sounds goo ain! </p>
					</section>
					<hr />
					<section>
						<hgroup>
							<h2> purple </h2>
						</hgroup>
						<p> Purple is cool so **** your dick slut </p>
					</section>
					<hr />
					<section>
						<hgroup>
							<h2> Blue </h2>
						</hgroup>
						<p> Some monkeys have blue butts!! WTF RIGHT?</p>
					</section>
					<hr />
					<section>
						<hgroup>
							<h2> Red </h2>
						</hgroup>
						<p> Red Knobs can be mistaken for cherry sause......</p>
					</section>
				</div>	
</div>
Code:
#container {
width:25%;
z-index:-1;
position:fixed;
margin-left:75%;
float:right;
height:100%;
background-color:purple;
}

#test {
padding: 10px;
}