hi, just wondering if anyone could help my with the coding i need to make some graphics stay while the content scrolls under it. O.K. that sounds really confusing. Actually, if anyone could give me the gist of how <!-- w --><a class="postlink" href="http://www.bungie.net">www.bungie.net</a><!-- w --> made their top and bottom nav bars stay, and have Master Chiefs gun float over the text while all that content scrolled underneath, that would be fantastic. Thank you.DHTML my friend. Lots of DHTML. You'll probably have more luck in the DHTML forum on this site.Fixed positioning would work perfectly for this, but guess what? Yes, that's right, another well established part of the specification that IE doesn't support.
If your set on doing this with css, then you could try this:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Scrolly div thing.</title>
<style type="text/css">
div#text{
width: 300px;
height: 300px;
position: absolute;
left: 100px;
right: 150px;
overflow: auto;
}
</head>
<body>
<div id="text">
<p>This text will scroll when there's enough of it. This is pretty good because all the other bits and pieces can be positioned without buggering anything up, it's also cross-browser friendly. The one limitiation is that the scroll bar will be on the edge of the >div<, rather than at the edge of the page.</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus commodo aliquet diam. Nunc eget orci et nunc tristique volutpat. Suspendisse in mi ut nunc ornare vestibulum. Suspendisse dui est, tempus ut, consectetuer ac, imperdiet et, nisl. Phasellus pellentesque dignissim lacus. Aliquam aliquet. Donec sagittis dui. Phasellus tellus. Ut congue fermentum diam. Quisque nec ipsum id odio auctor auctor. Vestibulum sollicitudin, dolor iaculis dignissim scelerisque, nulla orci rhoncus magna, nec laoreet pede libero non enim. Nulla facilisi. Donec bibendum, risus non pulvinar euismod, tortor wisi molestie ante, vel euismod ipsum turpis eu justo. Donec laoreet tempor augue. Ut tortor mauris, convallis sit amet, placerat at, blandit non, sapien. Praesent venenatis pulvinar neque. Integer dapibus, ligula sit amet rutrum vestibulum, augue nulla dictum ligula, vel venenatis nulla nibh non velit. Suspendisse adipiscing ullamcorper eros. Cras suscipit.</p>
</div>
</body>
If your set on doing this with css, then you could try this:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Scrolly div thing.</title>
<style type="text/css">
div#text{
width: 300px;
height: 300px;
position: absolute;
left: 100px;
right: 150px;
overflow: auto;
}
</head>
<body>
<div id="text">
<p>This text will scroll when there's enough of it. This is pretty good because all the other bits and pieces can be positioned without buggering anything up, it's also cross-browser friendly. The one limitiation is that the scroll bar will be on the edge of the >div<, rather than at the edge of the page.</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus commodo aliquet diam. Nunc eget orci et nunc tristique volutpat. Suspendisse in mi ut nunc ornare vestibulum. Suspendisse dui est, tempus ut, consectetuer ac, imperdiet et, nisl. Phasellus pellentesque dignissim lacus. Aliquam aliquet. Donec sagittis dui. Phasellus tellus. Ut congue fermentum diam. Quisque nec ipsum id odio auctor auctor. Vestibulum sollicitudin, dolor iaculis dignissim scelerisque, nulla orci rhoncus magna, nec laoreet pede libero non enim. Nulla facilisi. Donec bibendum, risus non pulvinar euismod, tortor wisi molestie ante, vel euismod ipsum turpis eu justo. Donec laoreet tempor augue. Ut tortor mauris, convallis sit amet, placerat at, blandit non, sapien. Praesent venenatis pulvinar neque. Integer dapibus, ligula sit amet rutrum vestibulum, augue nulla dictum ligula, vel venenatis nulla nibh non velit. Suspendisse adipiscing ullamcorper eros. Cras suscipit.</p>
</div>
</body>