473,326 Members | 2,133 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,326 software developers and data experts.

CSS with XSL & XML: Scrolling Table ... almost there!

39
Dear all,

I have been working to implement a scrolling table into an xml / xsl interface and so far have managed to put together an acceptable version using <thead> and <tbody> syntax. Indeed for the html examples that I found out there this seems to work perfectly.

On the surface it also works perfectly in my xml / xsl implementation too (also based on html underneath). Indeed, using IE6*, you can take a look at a cut-down example by going to this link ...

http://alse.load4.net/scrollproblem/scrollproblem.xml

... and then selecting 'Milan', 'Report Test' and clicking on 'Run'.

This gives a nice scrolling list which is exactly what I want.

However ...

If you scroll to the bottom of the list in the scrolling area (the list is short as I have removed most of the data and all the reports except for this one) and then resize the window, the headers are distorted. With more data (which is normally the case for us) the distortion is even worse.

I have spent many hours tweaking my CSS (contain in the XSL file for convenience) and the HTML but just can't get rid of the 'distortion-on-resize' problem.

I am hoping that either ...
a.) There is a way to block the browser from being resized (I don't know if there is?)
... or ...
b.) Someone can take a look at my syntax and offer a suggestion to sort this out.

The source code can be obtained by clicking on the two hyperlinks 'xml file' and 'xsl file' included in the link. Indeed, I believe that the problem (and solution) may lie in some dynamic CSS declarations ( e.g. top: expression(offsetParent.scrollTop); /*IE5+ only*/ ) which I have obtained from various examples but don't understand completely.

Many thanks for any help that you can give as this could be a great little tool if we can sort out this last hurdle.

Regards,
Alan Searle

*: This solution is only designed to work with IE as that is what we have in-house.

CSS: Here are the CSS declarations which are contained in the XSL file ...

[code]
<style type="text/css" media="screen">
table {width: 99%;
background-color: #E2EFFE;
border-style: solid;
border-collapse:collapse;
border-color: #316AC5;}
table.displayframe {
background-color: white;
border: solid 1px #316AC5;}
h1 {margin-top: 1em; font-variant: normal;}
h2 {margin-left:5px;}
h3 {margin-left:5px;}
div.tableContainer {
width: 100%; /* table width will be 99% of this*/
height: 344px; /* must be greater than tbody*/
overflow: auto;
margin: 0 auto;}
table.cont {
width: 98%; /*100% of container produces horiz. scroll in Mozilla*/
border: none;
background-color: #E2EFFE;}
table.cont>tbody {
/* child selector syntax which IE6 and older do not support*/
overflow: auto;
height: 301px;
overflow-x: hidden;}
thead.cont tr {
border: none;
position:relative;
top: expression(offsetParent.scrollTop); /*IE5+ only*/
}
thead.cont td, thead.cont th {
font-size: 14px;
background-color: white;
color: blue;
border: none;
/* border-top: solid 1px #d8d8d8; */
}
td.cont {
color: #000;
padding-right: 2px;
font-size: 8px;
border-bottom: solid 1px #d8d8d8;
border-left: solid 1px #d8d8d8;}
table.cont tfoot tr { /*to help IE*/
position: relative; overflow-x: hidden;
top: expression(parentNode.parentNode.offsetHeight >= offsetParent.offsetHeight ? 0 - parentNode.parentNode.offsetHeight + offsetParent.offsetHeight + offsetParent.scrollTop : 0);
}
a:link {text-decoration: underline;}
a:hover {text-decoration: underline;
color: #851D9E;}
a:visited {text-decoration: underline;
color: #8080C0;}
</style>
Nov 24 '07 #1
1 3042
drhowarddrfine
7,435 Expert 4TB
No, the browser cannot be forced to a fixed size.

I can't help you with the "expression" problem because it is non-standard and I know nothing about it.

I also don't have IE available till I get home tonight but I'm very rusty on my xml and not sure I can help anyway.
Nov 24 '07 #2

Sign in to post your reply or Sign up for a free account.

Similar topics

7
by: Pete | last post by:
I'm working (playing) on a mouse following script. Yes, the sort no one likes but I'm having great fun tinkering with it - sad. Anyway, if there's enough page content to cause scrolling and I...
72
by: Mel | last post by:
Are we going backwards ? (please excuse my spelling...) In my opinion an absolute YES ! Take a look at what we are doing ! we create TAGS, things like <H1> etc. and although there are tools...
5
by: Frances Del Rio | last post by:
why do I keep getting scroll bars on frames even though I have scrolling set to "no"?? (am on IE..) I mean even if you put an img in there or sthg that's a bit larger than the frame if you set...
44
by: Jim M | last post by:
I have had great success with using <iframe> with overflow-y set to auto. I can get a similar look with the <iframe> tag. BUT... In all cases I need to have fixed heights. Is there a way to...
4
by: webdev | last post by:
lo all, some of the questions i'll ask below have most certainly been discussed already, i just hope someone's kind enough to answer them again to help me out.. so i started a python 2.3...
0
by: zerobearing2 | last post by:
Hi all- I'm migrating to postgres from the MS SQL Server land, as I can see a great potential with postgres, I was wondering if anyone has experimented or started a project with XML inside user...
0
by: dnphamus13 | last post by:
I'm new to this and drowning right now. I would like to put my database online for viewing. I managed to do the filtering but i need to do PAGING as the XML doc get bigger. From what i understand...
0
by: gunimpi | last post by:
http://www.vbforums.com/showthread.php?p=2745431#post2745431 ******************************************************** VB6 OR VBA & Webbrowser DOM Tiny $50 Mini Project Programmer help wanted...
0
by: Tarik Monem | last post by:
I have been working on an all AJAX/DOM web site which is set to go live today and I thought I'd share my discoveries with all of you whom have helped me when I have encountered different issues along...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.