Étendre une largeur div en fonction de la largeur de ses enfants

Voici mon petit problème (la valeur sont juste ici pour l'exemple):

Permet de dire que j'ai une fenêtre avec une largeur autour de 500px.
À l'intérieur de mon document, j'ai un div extérieure sans spécification de la largeur, mais le code css suivant:

.outer{
  white-space:nowrap;
  background:blue;
}

À l'intérieur de ce div, ce sont 3 autres div qui ont les propriétés suivantes:

.t1{
  display:inline-block;
  width:400px;
}

(avis de la largeur de 400px. C'est là le problème est, la ligne est plus large que la fenêtre, et que l'extérieur de la div ne s'étend pas.
Le code HTML ressemble à ça:

<div class="outer">
    <div class="t1">1</div>
    <div class="t1">2</div>
    <div class="t1">3</div>
</div>

Ce que je suis en train de réaliser est d'avoir les 3 intérieures de div avec un fond bleu, sans la valeur de la t1 classe. Ce que cet exemple va produire un fond bleu limité à la largeur de la fenêtre.

Voir l'exemple complet ici : http://jsfiddle.net/sjCTR/ (vous devrez vous adapter le coin en bas à gauche si votre écran est de grande taille)

Je me demandais si en quelque sorte qui pourrait être atteint thru css/html uniquement, sans réglage de la div extérieure largeur intérieure div fond?

source d'informationauteur Py.