Alinhamento vertical do meio com grade responsiva do Bootstrap [duplicata]

Esta questão já tem uma resposta aqui:

Eu tenho um problema muito simples no meio verticalspan usandoBootstrap 2.3.2.

Requisitos:

Existem duas colunas, a coluna da esquerda tem uma altura fixa de 300px, porque existe uma imagem de 300x300 no interior.

A coluna da direita tem texto e deve ser centralizada com base na coluna da esquerda.

A coisa toda deve ser responsiva. É por isso que estou usando a imagem responsiva.

Se a segunda coluna for para baixo, sua altura deve caber no tamanho do texto. Isso significa que não posso definir a altura fixa na segunda coluna.

Não deve usar o JS para resolver isso.

HTML:

<div class="container-fluid">
  <div class="row-fluid">
    <div class="span6">
        <img class="img-responsive" src="http://placehold.it/300x300"/>
    </div>
    <div class="span6 v-center">
        <div class="content">
            <h1>Title</h1>
            <p>Paragraph</p>
        </div>
    </div>
  </div>
</div>

CSS:

.v-center {
    display:table;
    border:2px solid gray;
    height:300px;
}

.content {
    display:table-cell;
    vertical-align:middle;
    text-align:center;
}

Meu código: http://jsfiddle.net/qhoc/F9ewn/1/

Você pode ver o que eu fiz acima: eu basicamente definir a segunda colunaspan como mesa emiddle a.content célula de tabela. Copiei esse método aquiComo usar o alinhamento vertical no bootstrap (com exemplo de trabalho aquihttp://jsfiddle.net/lharby/AJAhR/)

Meu desafio é um pouco diferente devido aos requisitos acima. Alguma ideia de como fazer isso funcionar? Obrigado.