Расположение / выравнивание средних элементов в 3-колоночном макете

Question

Вот моя текущая разметка: http://jsfiddle.net/LcMU3/64/.

У меня проблемы с позиционированием / выравниванием элементов в средней колонке.

Во-первых, я хочу выровнять элементы по центру по вертикали, а также по центру по горизонтали.

Во-вторых, я хочу "плавать" стрелки слева и справа от "weekLabel".

В конечном итоге это будет выглядеть так:

На самом деле я пытался расположить и выровнять элементы во вложенном 3-колоночном макете, но главная проблема, с которой я столкнулся при таком подходе, заключается в том, что разметку HTML становится трудно выполнить со всеми вложенными элементами div.

Буду признателен за любую помощь.

Answer 1

Как и display:inline-block, поскольку div по умолчанию равно display:block

.weekLabel{
    display:inline-block;
    float:left;
}
.leftArrow {
    display:inline-block;
    float:left;
}

.rightArrow {
    display:inline-block;
    float:left;
}

Answer 2

Комбо inline-block / vertical-align FTW:

.leftArrow,.rightArrow,.weekLabel {
    display:inline-block;
    vertical-align:middle;
}

(остерегайтесь ширины #wrapper)

Answer 3

http://jsfiddle.net/LcMU3/67/

вы должны дать этим элементам значение float: left; и назначьте text-align: center для недельной метки, чтобы центрировать текст, и некоторые поля для завершения:

.leftArrow {
    float:left
}

.rightArrow {
    float:left;
}

.weekLabel{
float:left;
text-align:center;
margin-left:10px;
margin-right:10px;
}