For some days I've spent hours and hours increating a page that is rendered 
with the attached CSS. Aftertravelling round in the forum several tutorials and 
Google, I reallydon't know why the most described solution doesn't work for me. 
I'msure I overlook an important detail. Now I'm asking you professionalsout 
there in the world for the golden hint.

The test app should load only one page that shows a navigation menu usingCSS. 
If I load this HTML page directly into the browser, it is shown correctly. If I 
call the page within the Tapestry application, the CSS styles are not shown. It 
seems like there wouldn't be any CSS file. The page is shown like written with  
"naked" HTML.


Could anyone have a short look and *please* post a tip or a solution ?

Thank you very much.


Peter


---------------------------------------------

The .application file:

[code]

<?xml version="1.0"?>
<!DOCTYPE application PUBLIC
"-//Apache Software Foundation//Tapestry Specification 4.0//EN"
"http://jakarta.apache.org/tapestry/dtd/Tapestry_4_0.dtd";>

<application>
<meta key="org.apache.tapestry.page-class-packages" 
value="de.peter_siegel.tapestry.pages"/>
<meta key="org.apache.tapestry.disable-caching" value="true"/>
<meta key="org.apache.tapestry.home-page" value="Menu"/>
</application>

[/code]

---------------------------------------------

The menu's .html file:

[code]<html jwcid="@Shell" stylesheet="ognl:assets.css" title="Navigation">
<head jwcid="$remove$">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" type="text/css" href="Menu.css"/>
</head>
<body>
<div id="navigation">
<ul>
<li> <a href="#" target="app"> Back </a> </li>
<li> <a href="#" target="app"> Forward </a> </li>
<li> <a href="#" target="app"> Reload </a> </li>
</ul>
</div>
</body>
</html>
[/code]

---------------------------------------------

The menu's .page file:

[code] 

<?xml version="1.0"?>
<!DOCTYPE page-specification PUBLIC
"-//Apache Software Foundation//Tapestry Specification 4.0//EN"
"http://jakarta.apache.org/tapestry/dtd/Tapestry_4_0.dtd";>

<page-specification class="de.peter_siegel.tapestry.pages.Menu">
<asset name="css" path="context:/WEB-INF/Menu.css"/>
</page-specification>

[/code]

The menu's CSS file:

[code]

#navigation  {
font-family: Arial, Helvetica, sans-serif;
font-size: .9em;
}

#navigation ul {
list-style: none;
margin: 0;
padding: 0;
padding-top: 4px;
}

#navigation li {
display: inline;
}

#navigation a:link, #navigation a:visited {
padding: 3px 10px 2px 10px;
color: #FFFFFF;
background-color: #B51032;
text-decoration: none;
border: 1px solid #711515;
}

#navigation a:hover {
color: #FFFFFF;
background-color: #711515;
}         

[/code]


---------------------------------------------

The menu's .java  page:

[code]

package de.peter_siegel.tapestry.pages;

import org.apache.tapestry.html.BasePage;

public class Menu extends BasePage {
}

[/code]

---------------------------------------------

The rendered output HTML code in the browser:

[code]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd";>
<!-- Application: null -->
<!-- Page: Menu -->
<!-- Generated: Wed Sep 20 16:02:51 CEST 2006 -->
<html>
<head>
<meta name="generator" content="Tapestry Application Framework, version 4.0.2"/>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<base href="http://localhost:8080/TapestryHelloWorld/"/>
<title>Navigation</title>
<link rel="stylesheet" type="text/css" 
href="/TapestryHelloWorld/WEB-INF/Menu.css"/>
</head>
<body>
<div id="navigation">

<ul>
<li> <a href="#" target="app"> Back </a> </li>
<li> <a href="#" target="app"> Forward </a> </li>
<li> <a href="#" target="app"> Reload </a> </li>

</ul>
</div>
</body>
</html>
<!-- Render time: ~ 120 ms -->
[/code]



Reply via email to