It could have to do with the DOCTYPE declaration at the top of the HTML
file.  Tapestry explicitly puts one there and most people don't when
tinkering around.  Firefox, in particular, behaves differently if the
DOCTYPE is specified.  Does your static HTML file have a DOCTYPE?  Look at
the generated HTML source when you put it in Tapestry.

-----Original Message-----
From: Vincent [mailto:[EMAIL PROTECTED] 
Sent: Thursday, March 02, 2006 4:56 AM
To: Tapestry users
Subject: Re: Tapestry with CSS which made a scrollbale table

Hi ,

I met the similar problem the page is with CSS in static html is ok,
but when you trying to put in Tapestry , it does not look same.

regards,
Vincent

On 3/2/06, Ryan Pan <[EMAIL PROTECTED]> wrote:
> It is the example HTML file.
> <html>
> <head>
>     <!-- <DEFANGED_STYLE type="text/css">
>     --> </DEFANGED_STYLE>
> </head>
> <body>
> <div id="tableContainer" class="tableContainer">
>                     <table id="tableLineInformation" width="940"
> class="scrollTable">
>
>                         <thead class="fixedHeader">
>
>                             <tr id="headTR">
>
>                                 <th>rrrr</th>
>
>                                 <th>eeee</th>
>
>                                 <th>wwww</th>
>
>                                 <th>qqqq</th>
>
>                             </tr>
>
>                         </thead>
>
>                         <tbody class="scrollContent">
>
>                             <span jwcid="@For" source="ognl:fff"
> value="eee">
>                              <tr>
>
>                                 <td><span jwcid="@Insert"
> value="ognl:ddd"/></td>
>
>                                 <td><span jwcid="@InsertText"
> value="ognl:ccc"/></td>
>
>                                 <td><span jwcid="@InsertText"
> value="ognl:bbb"/></td>
>
>                                 <td><span jwcid="@InsertText"
> value="ognl:aaa"/></td>
>
>                             </tr>
>                             </span>
>                         </tbody>
>
>                     </table>
>                     </div>
>     </body>
> </html>
>
> 2006/3/2, Ryan Pan <[EMAIL PROTECTED]>:
> >
> > Hi all,
> >     Is there anyone who can help me to solve this problem?
> >     I download an CSS file from Internet which can make a scrollable
table
> > with fixed header,and I tried for an normal HTML file it is okay.But
when
> > I changed it to tapestry and visit it through Tomcat,I 've got a
abnormal
> > layout of HTML,the header of the table moved to somewhere it was not
ought
> > to be.So I guess there may be something wrong with render of tapestry.
> >    Who can tell me why its appearance was different while using some CSS
> > file and HTML file?(I attached the css file as below)
> >
> > Thanks,
> > Ryan.
> >
> > Note:
> >     Below is the content of CSS file:
> > /* Terence Ordona, portal[AT]imaputz[DOT]com         */
> > /* http://creativecommons.org/licenses/by-sa/2.0/    */
> >
> > /* begin some basic styling here                     */
> >
> > /* end basic styling                                 */
> >
> > /* define height and width of scrollable area. Add 16px to width for
> > scrollbar          */
> > div.tableContainer {
> >     clear: both;
> >     border: 1px solid #963;
> >     height: 245px;
> >     overflow: scroll;
> >     width: 956px
> > }
> >
> > /* Reset overflow value to hidden for all non-IE browsers. */
> > html>body div.tableContainer {
> >     overflow: hidden;
> >     width: 956px
> > }
> >
> > /* define width of table. IE browsers only                 */
> > div.tableContainer table {
> >     float: left;
> >     width: 940px
> > }
> >
> > /* define width of table. Add 16px to width for scrollbar.           */
> > /* All other non-IE browsers.                                        */
> > html>body div.tableContainer table {
> >     width: 956px
> > }
> >
> > /* set table header to a fixed position. WinIE 6.xonly
*/
> > /* In WinIE 6.x, any element with a position property set to relative
and
> > is a child of       */
> > /* an element that has an overflow property set, the relative value
> > translates into fixed.    */
> > /* Ex: parent element DIV with a class of tableContainer has an overflow
> > property set to auto */
> > thead.fixedHeader tr {
> >     position: relative;
> > }
> >
> > /* set THEAD element to have block level attributes. All other non-IE
> > browsers            */
> > /* this enables overflow to work on TBODY element. All other non-IE,
> > non-Mozilla browsers */
> > html>body thead.fixedHeader tr {
> >     display: block
> > }
> >
> > /* make the TH elements pretty */
> > thead.fixedHeader th {
> >     background: #C96;
> >     border-left: 1px solid #EB8;
> >     border-right: 1px solid #B74;
> >     border-top: 1px solid #EB8;
> >     font-weight: normal;
> >     padding: 4px 3px;
> >     text-align: left
> > }
> >
> > /* make the A elements pretty. makes for nice clickable
> > headers                */
> > thead.fixedHeader a, thead.fixedHeader a:link, thead.fixedHeader
a:visited
> > {
> >     /*color: #FFF;*/
> >     display: block;
> >     text-decoration: none;
> >     /*width: 100%*/
> > }
> >
> > /* make the A elements pretty. makes for nice clickable
> > headers                */
> > /* WARNING: swapping the background on hover may cause problems in WinIE
> > 6.x   */
> > thead.fixedHeader a:hover {
> >     /*color: #FFF;*/
> >     display: block;
> >     text-decoration: underline;
> >     /*width: 100%*/
> > }
> >
> > /* define the table content to be
> > scrollable                                              */
> > /* set TBODY element to have block level attributes. All other non-IE
> > browsers            */
> > /* this enables overflow to work on TBODY element. All other non-IE,
> > non-Mozilla browsers */
> > /* induced side effect is that child TDs no longer accept width:
> > auto                     */
> > html>body tbody.scrollContent {
> >     display: block;
> >     height: 262px;
> >     overflow: auto;
> >     /*width: 100%*/
> > }
> >
> > /* make TD elements pretty. Provide alternating classes for striping the
> > table */
> > /* http://www.alistapart.com/articles/zebratables/
> > */
> > tbody.scrollContent td, tbody.scrollContent tr.normalRow td {
> >     /*background: #FFF;*/
> >     border-bottom: none;
> >     border-left: none;
> >     border-right: 1px solid #CCC;
> >     border-top: 1px solid #DDD;
> >     padding: 2px 3px 3px 4px
> > }
> >
> > tbody.scrollContent tr.alternateRow td {
> >     /*background: #EEE;*/
> >     border-bottom: none;
> >     border-left: none;
> >     border-right: 1px solid #CCC;
> >     border-top: 1px solid #DDD;
> >     padding: 2px 3px 3px 4px
> > }
> >
> > /* define width of TH elements: 1st, 2nd, and 3rd respectively.
> > */
> > /* Add 16px to last TH for scrollbar padding. All other non-IE browsers.
> > */
> > /* http://www.w3.org/TR/REC-CSS2/selector.html#adjacent-selectors
> > */
> > html>body thead.fixedHeader th {
> >     /*width: 200px*/
> > }
> >
> > html>body thead.fixedHeader th + th {
> >     /*width: 240px*/
> > }
> >
> > html>body thead.fixedHeader th + th + th {
> >     /*width: 316px*/
> > }
> >
> > /* define width of TD elements: 1st, 2nd, and 3rd respectively.
> > */
> > /* All other non-IE browsers.
> > */
> > /* http://www.w3.org/TR/REC-CSS2/selector.html#adjacent-selectors
> > */
> > html>body tbody.scrollContent td {
> >     /*width: 200px*/
> > }
> >
> > html>body tbody.scrollContent td + td {
> >     /*width: 240px*/
> > }
> >
> > html>body tbody.scrollContent td + td + td {
> >     /*width: 300px*/
> > }
> >
>
>



---------------------------------------------------------------------
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]

Reply via email to