table overflow

J

JJ

I want my table to have scroll bars if it goes beyound 400px. this does not
work is it because of a <div> is not set right? the page starts <table
class="table">

any suggestions?

thanks JJ

here is the css table
..table
border: 5px ridge #565a61;
color: #000000;
border-collapse: collapse;
padding: 0px;
border: 1px;
font-size: 100%;
float: center;
margin: 0px 0px 0px 80px;
text-align: center;
height: 400px;
overflow: scroll;
 
B

Bob

Not sure of what you want but....
Try changing the ...

.table {
border: 5px ridge #565a61;
color: #000000;
border-collapse: collapse;
padding: 0px;
border: 1px;
font-size: 100%;
float: center;
margin: 0px 0px 0px 80px;
text-align: center;
height: 400px;
overflow: scroll;
}

to

.table {
border: 5px ridge #565a61;
color: #000000;
border-collapse: collapse;
padding: 0px;
border: 1px;
font-size: 100%;
float: center;
margin: 0px 0px 0px 80px;
text-align: center;
height: 400px;
overflow: auto;
}

and see if that helps

bob
|I want my table to have scroll bars if it goes beyound 400px. this does not
| work is it because of a <div> is not set right? the page starts <table
| class="table">
|
| any suggestions?
|
| thanks JJ
|
| here is the css table
| .table
| border: 5px ridge #565a61;
| color: #000000;
| border-collapse: collapse;
| padding: 0px;
| border: 1px;
| font-size: 100%;
| float: center;
| margin: 0px 0px 0px 80px;
| text-align: center;
| height: 400px;
| overflow: scroll;
 
M

Murray

A table will not drop a scrollbar.

I'd need to see the rest of the code to say more.
 
K

Kevin Spencer

Juat a thought: A div inside a cell of a table *can* have scroll bars...

--
HTH,

Kevin Spencer
Microsoft MVP
..Net Developer
Who is Mighty Abbott?
A twin turret scalawag.
 
B

Bob

Scrolling Text "Area" (in a table), Without Frames

<HTML>
<head>
<style type="text/css">
div.scroll {
height: 100px;
width: 100%;
overflow: auto;
background-color: #FF00FF;
}
</style>
</head>

<body>
<table width="30%">
<tr>
<td>
<div class="scroll">
<p> Content Goes Here </p>
<p> Content Goes Here </p>
<p> Content Goes Here </p>
<p> Content Goes Here </p>
<p> Content Goes Here </p>
<p> Content Goes Here </p>
</div>
</td>
</tr>
</table>
</body>
</HTML>

There you are a <div> within a table that scrolls....
Right?

bob

| Yes - but then that's not a <table> is it?
|
| --
| Murray
| --------------
| MVP FrontPage
|
|
| | > Juat a thought: A div inside a cell of a table *can* have scroll bars...
| >
| > --
| > HTH,
| >
| > Kevin Spencer
| > Microsoft MVP
| > .Net Developer
| > Who is Mighty Abbott?
| > A twin turret scalawag.
| >
| > | >>A table will not drop a scrollbar.
| >>
| >> I'd need to see the rest of the code to say more.
| >>
| >> --
| >> Murray
| >> --------------
| >> MVP FrontPage
| >>
| >>
| >> | >>> Not sure of what you want but....
| >>> Try changing the ...
| >>>
| >>> .table {
| >>> border: 5px ridge #565a61;
| >>> color: #000000;
| >>> border-collapse: collapse;
| >>> padding: 0px;
| >>> border: 1px;
| >>> font-size: 100%;
| >>> float: center;
| >>> margin: 0px 0px 0px 80px;
| >>> text-align: center;
| >>> height: 400px;
| >>> overflow: scroll;
| >>> }
| >>>
| >>> to
| >>>
| >>> .table {
| >>> border: 5px ridge #565a61;
| >>> color: #000000;
| >>> border-collapse: collapse;
| >>> padding: 0px;
| >>> border: 1px;
| >>> font-size: 100%;
| >>> float: center;
| >>> margin: 0px 0px 0px 80px;
| >>> text-align: center;
| >>> height: 400px;
| >>> overflow: auto;
| >>> }
| >>>
| >>> and see if that helps
| >>>
| >>> bob
| >>> | >>> |I want my table to have scroll bars if it goes beyound 400px. this
does
| >>> not
| >>> | work is it because of a <div> is not set right? the page starts
<table
| >>> | class="table">
| >>> |
| >>> | any suggestions?
| >>> |
| >>> | thanks JJ
| >>> |
| >>> | here is the css table
| >>> | .table
| >>> | border: 5px ridge #565a61;
| >>> | color: #000000;
| >>> | border-collapse: collapse;
| >>> | padding: 0px;
| >>> | border: 1px;
| >>> | font-size: 100%;
| >>> | float: center;
| >>> | margin: 0px 0px 0px 80px;
| >>> | text-align: center;
| >>> | height: 400px;
| >>> | overflow: scroll;
| >>>
| >>>
| >>
| >>
| >
| >
|
|
 
B

Bob

But you can use one within a table!
Ugh.... do not use absolute positioning...

bob
| Right. To paraphrase t.s.eliot, a div is not a table....
|
| --
| Murray
| --------------
| MVP FrontPage
|
|
| | >
| > Scrolling Text "Area" (in a table), Without Frames
| >
| > <HTML>
| > <head>
| > <style type="text/css">
| > div.scroll {
| > height: 100px;
| > width: 100%;
| > overflow: auto;
| > background-color: #FF00FF;
| > }
| > </style>
| > </head>
| >
| > <body>
| > <table width="30%">
| > <tr>
| > <td>
| > <div class="scroll">
| > <p> Content Goes Here </p>
| > <p> Content Goes Here </p>
| > <p> Content Goes Here </p>
| > <p> Content Goes Here </p>
| > <p> Content Goes Here </p>
| > <p> Content Goes Here </p>
| > </div>
| > </td>
| > </tr>
| > </table>
| > </body>
| > </HTML>
| >
| > There you are a <div> within a table that scrolls....
| > Right?
| >
| > bob
| >
| > | > | Yes - but then that's not a <table> is it?
| > |
| > | --
| > | Murray
| > | --------------
| > | MVP FrontPage
| > |
| > |
| > | | > | > Juat a thought: A div inside a cell of a table *can* have scroll
| > bars...
| > | >
| > | > --
| > | > HTH,
| > | >
| > | > Kevin Spencer
| > | > Microsoft MVP
| > | > .Net Developer
| > | > Who is Mighty Abbott?
| > | > A twin turret scalawag.
| > | >
| > | > | > | >>A table will not drop a scrollbar.
| > | >>
| > | >> I'd need to see the rest of the code to say more.
| > | >>
| > | >> --
| > | >> Murray
| > | >> --------------
| > | >> MVP FrontPage
| > | >>
| > | >>
| > | >> | > | >>> Not sure of what you want but....
| > | >>> Try changing the ...
| > | >>>
| > | >>> .table {
| > | >>> border: 5px ridge #565a61;
| > | >>> color: #000000;
| > | >>> border-collapse: collapse;
| > | >>> padding: 0px;
| > | >>> border: 1px;
| > | >>> font-size: 100%;
| > | >>> float: center;
| > | >>> margin: 0px 0px 0px 80px;
| > | >>> text-align: center;
| > | >>> height: 400px;
| > | >>> overflow: scroll;
| > | >>> }
| > | >>>
| > | >>> to
| > | >>>
| > | >>> .table {
| > | >>> border: 5px ridge #565a61;
| > | >>> color: #000000;
| > | >>> border-collapse: collapse;
| > | >>> padding: 0px;
| > | >>> border: 1px;
| > | >>> font-size: 100%;
| > | >>> float: center;
| > | >>> margin: 0px 0px 0px 80px;
| > | >>> text-align: center;
| > | >>> height: 400px;
| > | >>> overflow: auto;
| > | >>> }
| > | >>>
| > | >>> and see if that helps
| > | >>>
| > | >>> bob
| > | >>> | > | >>> |I want my table to have scroll bars if it goes beyound 400px.
this
| > does
| > | >>> not
| > | >>> | work is it because of a <div> is not set right? the page starts
| > <table
| > | >>> | class="table">
| > | >>> |
| > | >>> | any suggestions?
| > | >>> |
| > | >>> | thanks JJ
| > | >>> |
| > | >>> | here is the css table
| > | >>> | .table
| > | >>> | border: 5px ridge #565a61;
| > | >>> | color: #000000;
| > | >>> | border-collapse: collapse;
| > | >>> | padding: 0px;
| > | >>> | border: 1px;
| > | >>> | font-size: 100%;
| > | >>> | float: center;
| > | >>> | margin: 0px 0px 0px 80px;
| > | >>> | text-align: center;
| > | >>> | height: 400px;
| > | >>> | overflow: scroll;
| > | >>>
| > | >>>
| > | >>
| > | >>
| > | >
| > | >
| > |
| > |
| >
| >
|
|
 
K

Kevin Spencer

Hi Murray,

No, it's not a table, but if used correctly *with* a table, it can, in a
sense, extend that table's functionality. I was trying to guess at the
layout requirement, which it seems to me employs a table or tables for
positioning. By inserting a div into a table cell, it is possible to, in
effect, add scrolling capability to the table cell. By setting the margins
and padding of the div to 0, and setting its width and height to 100%, the
div itself is "invisible" inside the table cell, except for the scroll
bar(s).

--
HTH,

Kevin Spencer
Microsoft MVP
..Net Developer
Who is Mighty Abbott?
A twin turret scalawag.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top