css - Match overflowing box height to its parent box

Question

I have box with nested image and div with text information. I'm doing simple CSS trick with positioning and display parameter changes on hover, so text box is only seen if hover on main box.

Here's my problem, text box has background with opacity, how can I match height of the box with background to its parent when it's show on hover.

Here's live example: http://jsfiddle.net/Mamaduka/jDYu5/16/

Answer 1

如果我理解正确，您需要做的就是给出texts一个高度100%

.box:hover .texts {
    display: block;
    height:100%;
}

当我编辑你的小提琴时为我工作。