Search code examples
htmlcssvertical-alignment

Vertically Align divs and text

[jsfiddle.net/c8q17Lu4/][1]

Hello,

I'm having trouble with probably an easy fix. I need to vertically align the '#header-right-b-headers' orange divs within the blue '#header-right-b' div, and also vertically align the text in the orange divs.

I've tried the vertical-align and display as inline block rules, and some others, and don't understand why it doesn't work. Can anybody help?

Solution

  • Set the line-height for the equal to the height of the wrapping div.

    Add

    .header-right-b-headers-end h3, .header-right-b-headers h3{
line-height: 20px;
}

    this to your CSS.

    Updated Fiddle