Help with CSS: backgrounds, overflow etc

Hi,

I'm trying to do a design with: http://xlibrisclients.co.uk/flybynite/new/V1.htm in mind. I want the content to have a scrollbar if content goes off the page... basically want to achieve the look and feel of a frame base site such as: http://www.flybynite.co.uk/website/ but only using CSS and tables.

Please help!

Janusz

.overflowScroll { overflow: auto; }

in your styles will make any <div class="overflowScroll"></div> (or indeed any block element that has been constrained by some sizing) sprout scrollbars.

Beware, test well in Mozilla based browsers because you can get mixed results depending on what you put inside.

Actually, just looking at that link i don't see your problem, you seem to have it sorted pretty well....

Try this ...

<div style="width:500px;height:100px;overflow-Y:scroll;">
<table border="0" cellpadding="0" cellspacing="0" height="200px">
<tr>
<td>This is your content Area.......scroll down</td>
</tr>
<tr>
<td>Place your content here</td>
</tr>
</table>
</div>


set the div style to "overflow-Y:auto" in case you need the scroll to appear only when content exceeds the div height.

When doing:

<div style="width:500px;height:100px;overflow-Y:scroll;">
<table border="0" cellpadding="0" cellspacing="0" height="200px">
<tr>
<td>This is your content Area.......scroll down</td>
</tr>
<tr>
<td>Place your content here</td>
</tr>
</table>
</div>

The content goes all the way up i.e. over the top part of the banner

Janusz

Works in mozilla (bar the content going over the top of the banner) but it dont work in IE

Ok,

Basically, want to have a CSS based site which has look and feel of a framed based site.

1) Top Banner goes along the top of the page and stays there
2) Side menu comes below the banner and hugging the left side of the browser and this is fixed and does not move
3) Content comes to the right of (2) and below (1) and if it exceeds page size, I want it to be scroll-able

Please help!

Janusz

Take this.....
<table border="1" cellpadding="0" cellspacing="0" height="200px">
<tr height="50px">
<td colspan="2">Place Top banner here</td>
</tr>
<tr>
<td width="25%">
Place Left Navigation here
</td>
<td width="75%">
<div style="width:500px;height:150px;overflow-Y:scroll;">
<table border="0" cellpadding="0" cellspacing="0" height="200px">
<tr>
<td>This is your content Area.......scroll down</td>
</tr>
<tr>
<td>Place your content here</td>
</tr>
</table>
</div>
</td>
</tr>
</table>

Nope - don't work

I want to combine:

(http://devnull.tagsoup.com/fixed/vertical.html OR http://jessey.net/simon/articles/007.html) AND http://devnull.tagsoup.com/fixed/horizontal.html

Janusz

Just wondering if this is available elsewhere - can see vertical, and can see horizontal, but not together

Janusz

See if either of these examples will help you.

http://garyblue.port5.com/webdev/scroll_in_table.html

http://garyblue.port5.com/webdev/scrollingtable.html

cheers,

gary

seems to be a timeout when I access those pages

:-(

Nice sig!

Janusz