-
Apr 26th, 2022, 12:19 PM
#1
[RESOLVED] HTML display issue
I have a page that displays a table of data. The table is within a DIV then I have another DIV that is used as a toolbar that gets aligned to the bottom
Code:
<div id="toolbar" style="position: fixed; bottom: 0px; left: 0px; width: 100%; color: #000; background: #c0c0c0;">
The problem I am seeing is that when there is more than a screen full of data the bottom row is hidden behind the tool bar.
What would I need to do to insure that the table does not go behind the toolbar?
Thanks
-
Apr 26th, 2022, 12:40 PM
#2
Re: HTML display issue
I found something online and tried it but the result was not so good
Code:
<tbody style="display: block; height: 50%; overflow-y: scroll"></tbody>
This did limit the table height but made everything show up under the first column header rather than lined up properly under the various column headers.
For now I have just added code that adds a couple of empty rows to the end to insure that none of the data is hidden when the table is scrolled to the bottom but I would really like to have the table stop at the top of the toolbar and not go behind it.
-
Apr 26th, 2022, 06:12 PM
#3
Re: [RESOLVED] HTML display issue
Looks like the display is ok now. I modified the style for the div tag where the table is located
Code:
<div style="height:85vh;overflow: auto;">
Now the table and scroll bar stops just above the toolbar and all data is visible when scrolled to the bottom.
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
|
Click Here to Expand Forum to Full Width
|