This card shows how to upgrade a Rails 2 application from Rails 2.3.8 through every single patch level up to 2.3.18, and then, hopefully, Rails LTS.

2.3.8 to 2.3.9

This release has many minor changes and fixes to prepare your application for Rails 3.

Step-by-step upgrade instructions:

0. Upgrade rails gem
1. Change your environment.rb so it says RAILS_GEM_VERSION = '2.3.9'
2. Change your environment.rb so all invocations ...

Back in the old days, we couldn't do something like that:

.foo {
  position: absolute;
  bottom: 0;
  /* This was bad: */
  left: 10px;
  right: 10px;
}

Why? Because IE5 and IE6 (which a majority of people used back then) failed horribly trying to render it.

I've now checked if this is still an issue with any browser that's not from the stone age. \
Turns out all is well -- except if you have to support IE6 and below, but then you're in some other kinds of trouble.

It works in all sane browsers, and Internet Explorer 7, 8...

Note: We have card with all CSS centering options. You probably want to head over there and get an overview over what techniques are available for your use case and browser requirements.

Horizontally centering a static element in CSS is normally handled by setting the left and right margins to auto, for example:

// SASS
$container_width: 100px
.container
  width: $container_width
  margin: 0 auto

However, this w...

calc() lets you mix CSS units. Ever wanted to give an element "the container's width minus 20px on each side"? Here you go:

.foo {
  width: calc(100% - (20px * 2));
}

When using Sass, you need to interpolate Sass expressions:

$margin: 20px * 2

.foo
  width: calc(100% - #{$margin})

Supported by all modern browsers and IE9+.

JavaScripts and CSS should be minified for production use.

In Rails 3.1+ the asset pipeline will take care of this. Thus you're best off using an uncompressed version of your Javascript in development. Also load the non-minified versions of libraries. This way debugging will be easier and you will still get all the minification love once deployed.

In Rails 2.3 and 3.0 you should at least embed external JavaScript libraries in minified form, using something like JavaScript compressor.

If you need to capture signatures on an IPad or similar device, you can use Thomas J Bradley's excellent Signature Pad plugin for jQuery.

To implement, just follow the steps on the Github page.

The form

If you have a model Signature with name: string, signature: text, you can use it with regular rails form like this:

- form_for @signature, :html => { :class => 'signature_form' } do |form|
  %dl
    %dt
      = form...

You can use the content CSS attribute to set an element's content -- which is especially useful for the :before and :after pseudo elements:

a:before {
  content: 'Click me: ';
}

The above example would prepend "Click me:" to any link on the page.

Note that you can also refer the contents of other attributes of the element. So, if your links have a helpful title set, you could do this:

a:before {
  content: attr(title) ": ";
}

There also is a jsFiddle for the examp...

Spreewald now comes with a step that tests if a form field is visible:

Then the "Due date" field should be visible
But the "Author" field should not be visible

The step works by looking up the field for the given label, then checks if that field is hidden via CSS (or Javascript).

It is not currently tested if the label is visible or hidden. For this see: [Check that an element is visible or hidden via CSS with Cucumber/Capybara](https://makandracards.com/makandra/1049-check-that-an-elem...

So you want to find out how many horizontal pixels you have available on a mobile device. This is super difficult because:

• Modern mobile devices have high-density displays where 1px in your CSS e.g. corresponds to 2.25, 4, ... physical pixels on the screen hardware.
• Difficult APIs
• Inconsistent APIs
• Screen orientation can change when the user rotates h...