Dynamic styles

Browser tags

Setup the _my_browser constant inside your template:

Syntax: <body class="<?php echo _my_browser; ?>">

This will generate a body class according to the visitor's browser:

Demonstration: <body class="none">

Browser styles

Define Google Chrome 4 and Mozilla Firefox 3:

  • .chrome4 input.button, .firefox3 input.button {
  • padding: 4px 5px !important;
  • }

What about fixing Internet Explorer 6 and 7:

  • .msie6 input.button, .msie7 input.button {
  • padding: 4px 0 2px 0 !important;
  • }

No need for conditional comments and CSS hacks anymore!

Browser selectors like chrome, firefox, konqueror, msie, netscape, opera and safari can only be used in combination with their major version number.

Section tags

Setup the _last_parameter constant inside your template:

Syntax: <body class="<?php echo _last_parameter; ?>">

This will generate a body class according to the current section.

Example: <body class="home">

Section styles

Define another background for #content that only affects your home section:

  • .home #content {
  • background: #666;
  • }

Use another template once the differences became too complex.