Step 1: Generate the cache files:

When you run this script, it will loop over all of the PATHS, on the given BASE_URL, for the given PROTOCOLS. It will store the files in a cache directory, one level up from where the script is located. This script assumes that all paths that you defined in PATHS end in a ‘/’ and will cache a version for the full url with and without that ‘/’ (having two different files for these resources makes it easier to write our .htaccess rules next).

bin/gen_cache.sh

#!/bin/bash

PATHS="/ /mobile/ /fb/"
PROTOCOLS="http"
BASE_URL="://example.com"

#-- CD into the project directory
cd "`dirname $0`/.."
if [ ! -d "cache" ]; then
  mkdir "cache"
fi
cd "cache"

for path in $PATHS; do
  for protocol in $PROTOCOLS; do
    base="${path//\//}"
    case "$protocol" in
      "http")
        cache_suffix="_off_cached.html"
        ;;
      "https")
        cache_suffix="_on_cached.html"
        ;;
    esac
    out_file="${base}${cache_suffix}"

    #-- Fetch the resource
    curl "${protocol}${BASE_URL}${path}" > "${out_file}"
    if [ 0 -ne $? ]; then
      #-- If the page did not download correctly, do not cache it
      rm "${out_file}"
    else 
      #-- Only contiune if the page actually loaded
      #echo "" >> "${out_file}"

      #-- If the resource is a sub directory create the alternative name for it
      #   This is so we can support /my_resource AND /my_resource/
      if [ -n "${base}" ]; then
        if [ ! -d "${base}" ]; then
          mkdir "${base}"
        fi
        cp "${out_file}" "${base}/${cache_suffix}"
      fi
    fi
  done
done

Step 2: Serve the cache files (to everyone but our curl script above):

Now that we have our cache files generated, all we have to do is server them. We do however want to let our cache generating script to always access the original source, and so we are only going to apply this rule if the current browser is currently not curl. If that’s the case, we check to make sure that the cache file exits, and if it does, we serve that instead of the actual, uncached resource.

.htaccess

#-- Serve cached files to non Curl user agents
RewriteCond %{HTTP_USER_AGENT} !^curl [NC]
RewriteCond %{DOCUMENT_ROOT}/cache/%{REQUEST_URI}_%{HTTPS}_cached.html -f
RewriteRule ^(.*)$ cache/$1_%{HTTPS}_cached.html [L]

Boom! Add our bin/gen_cache.sh file to run every minute in our cronttab and we’ve got a super cheap cache!

Note: This is only for unauthenticated pages, and there are much better ways to cache resource, like varnish, but for something that you can configure in minutes and only requiring curl, mod_rewrite, and cron, this is a decent start.

It took a while to find a method to downgrade that worked, but then I finally found http://askubuntu.com/questions/49869/how-to-roll-back-ubuntu-to-a-previous-version. The key was to use /etc/apt/preferences to prefer packages at 10.04.

apt-get install software-properties-common

Done!

You could add the following to your template file: (apps/frontend/templates/layout.php)

$sf_response->removeStylesheet('/m14tAdminGeneratorPlugin/css/admin.css');

But that just feels wrong. So instead, lets only load the plugin for the application that we want (config/ProjectConfiguration.class.php):

class ProjectConfiguration extends sfProjectConfiguration {
  public function setup() {
    $this->enablePlugins('sfDoctrinePlugin');
    ...
    if ( "admin" == sfConfig::get('sf_app') ) {
      $this->enablePlugins('m14tAdminGeneratorPlugin');
    }
  }
}

The main reason is that you don’t have a context set from the task, and if you create one it doesn’t know the domain to use when you generate absolute url’s. If you follow Symfony’s Documentation and add a host to the context of your routes, sfDoctrineRoute’s stopped working for me.

While I don’t like tying routing to my models, the solution at http://snippets.symfony-project.org/snippet/378 worked for me. Just watch out for the following erroneous line:
'is_secure' => sfConfig::get('app_host', false),

This post is password protected. To view it please enter your password below:

Password:

This post is password protected. To view it please enter your password below:

Password:

Style Sheet Reset

Start off on a level playing ground and clear out all of the settings that different browsers may inflict on you. I typically use Yahoo’s YUI Reset CSS, but there are plenty of others out there [google].

Start Styling

I typically do my initial implementation in FireFox 3.5 if for no other reason than the Firebug plugin. This is great for live editing of CSS, seeing why images aren’t loading, as well as AJAX and javascript debuging.

IE Selectors

So now that we have a fairly functional design, we fire up Windows to see what we have. I usually run IE8 in a Virtual Machine running the RC of Windows7. With this and the Internet Explorer Developer Toolbar, you generally get good results in IE8, and can simulate what it would likely look like in IE7 by using ‘Compatiblity Mode‘ (though there are some differences). So how do we fix these?

The key is to use an IE only stylesheet and a few hacks. To make a style sheet only be loaded by IE we’ll use a Conditional Comment:

<!–[if IE]>
<link href=”/css/ie-only.css” media=”screen” rel=”stylesheet” type=”text/css” />
<![endif]–>

Now in this file if we define a property, it will be used by all versions of IE, but if we prepend an asterisk (*) to the property name, IE 8 will ignore it, and if we prepend an underscore (_) to the property name then both IE 7 and 8 will ignore it. So with this hierarchy of hacks we can now create something like the following:

#header {
width: 100px; /* Used by all versions of IE */
*width: 110px; /* Used in IE 7 and below */
_width: 120px; /* Used in IE 6 and below */
}

Note that, in the relevant browsers, each of these properties are being overridden by the subsequent values and so it is crucial that we maintain this order of 1) no prefix, 2) asterisk prefix, 3) underscore prefix to get the results you are looking for. However it is perfectly fine to use any combination of these if you want to achieve the same result in different versions of IE.

Extraneous markup

If you can’t get your code to work without hacks or strange CSS tricks, don’t be afraid to add an extra <span> to those lists of links, or a clearing <div> here and there. Doing so can some times make your CSS cleaner, and lets face it, more people are going to be looking at the website than the code.

Last resort – Javascript

With these tricks you should be off and running, but in-case you inherited a project that used lots of unsupported CSS tricks (like the ‘+’ sibling selector and IE6), you can resort to javascript. IE7-js is a project created to make Microsoft Internet Explorer behave like a standards-compliant browser. It fixes many HTML and CSS issues and makes transparent PNG work correctly under IE5 and IE6.

Other Browsers

Now we have a site that works in Firefox and the 3 major IEs, but I haven’t mentioned anything about the other Grade A Browsers. If you look at various Google Analytics to find out for yourself.

In practice however, rarely do I find an issue with Safari that does not come up in Firefox and if we’ve done things in a fairly standard way, we should be ok in Opera.

Summary

That should do it. With these few tricks, you should be able to get your website pixel perfect in the most common browsers with out too much work. If you find this useful, or have any other tips, leave a comment!

There was an error starting the GNOME Settings Daemon.
Some things, such as themes, sounds, or background settings may not work
correctly.
The Settings Daemon restarted too many times.

After poking around for a little while, I finally came across Gentoo Bug 150909. I didn’t have the linking problem found by Stian Skejelstad, but Daniel Gryniewicz’s Comment to add eval `dbus-launch --sh-syntax --exit-with-session` to your ~/.xinitrc worked great.

My ~/.xinitrc now looks like this:

#– ~/.xinitrc
eval `dbus-launch –sh-syntax –exit-with-session`
exec gnome-session
#exec startfluxbox

php_flag magic_quotes_gpc on