html - 使父元素与子元素的高度相同？

Question

我有一个带有链接的标题，我想让 h2 成为链接的不同背景。但是，当我向链接添加填充时，它会溢出父母，我怎样才能让父母成为孩子的身高？

<h2><a href="#">Something</a></h2>  

h2 {background:blue; }
h2 a {background:red; padding:20px; color:white;}

JSfiddle：http: //jsfiddle.net/5LHmr/

谢谢

Answer 1

display: inline-block在h2 a { ... }规则集中设置：演示

Answer 2

采用display:inline-block

h2 a {
 background:red; 
 padding:20px; 
 color:white;
 display:inline-block;
}

Js小提琴

Answer 3

h2 {background:blue; padding:20px;}
h2 a {background:red; padding:20px; color:white;}

http://jsfiddle.net/5LHmr/4/