JSF Introduction - JSF and HTML5 - page 13

Listing 1-5. The simple.css File

h1, p, body, html {
margin:0;
padding:0;
}

body {
background-color:#EEEEEE;
}

#container {
width:100%;
}

#header {
background-color:#FFA500;
}

#header h1 {
margin-bottom: 0px;
}

#content {
float:left;
width:100%;
}

#footer {
clear:both; /*No floating elements are allowed on left or right*/
background-color:#FFA500;
text-align:center;
font-weight: bold;
}

.errorMessage {
color: red;
}

In order to change the page layout anytime without changing the HTML code of the web application, it is
recommended to use CSS.

■ Since JSF 2.0, page templates are supported. Before JSF 2.0, the JSF developers had to download and
configure a templating library (such as the Facelets library) in the JSF applications for defining the layout of the pages.

Note

Listing 1-6 shows the index.xhtml page code, which represents the introductory page of the application.