Radio CSS Tips

A Collection of tips and tricks for successfully using CSS with Radio

1. @import When adding a style sheet to the templates you may need to add two @import declarations. One to pick up the stylesheet on the desktop and the other for the published pages. For example

       
       <style type="text/css">
           @import "/all.css";
           @import "/0103451/all.css";
       </style>
   

2. Having trouble figuring out the difference between each of the templates and when they are used? Put the name of each template in the navigation bar of each template. Thanks Steven.
3. Not really a CSS tip, but if you want to create a blank vertical space in your navigation bar you can get one like this:

     <item name="&nbsp;" pagename=""/>  
   

4. Use the selectors part of CSS to get the effects you want. For example note that the links in the body of this blog are red while links in the navigation bar are orange. Here is the CSS code snippet that accomplishes this:

   A {
   	text-decoration: none;
   	font-weight:700;
   	color: rgb(220, 20, 60);
   }
   
   
   .navigation A {
   	color: rgb(255, 165, 0);
   } 
   

   So all links are red, bold and devoid of decoration unless you see them in a div with class name navigation, then they are orange, bold and devoid of decoration.
5. Be carefult of unwanted <p> tags in your rendered html. If Radio sees multiple carriage returns back to back it adds in <p> tags. This can play havoc with your layout and also cause problems when trying to validate your html.