Adding CSS Code to Style Views

Listing 26.14 shows the CSS code used to style the elements in the views. Each of the views links the styles.css script template in its header.

Listing 26.14 styles.css: Implementing the CSS styles for the view HTML files

Click here to view code image

01 div.form-container{
02   display: inline-block;
03   border: 4px ridge blue;
04   width: 280px;
05   border-radius:10px;
06   margin:10px;
07 }
08 p.form-header{
09   margin:0px;
10   font: 24px bold;
11   color:white;  background:blue;
12   text-align:center;
13 }
14 form{
15   margin:10px;
16 }
17 label{ width:80px; display: inline-block;}
18 input{
19   border: 3px ridge blue;
20   border-radius:5px;
21   padding:3px;
22 }
23 input[type=submit]{
24   font: 18px bold;
25   width: 120px;
26   color:white;  background:blue;
27   margin-top:15px;
28   margin-left:85px;
29 }