How do I make
and have the same line-height in HTML 5?

Question

How do I make p and span have the same line-height in HTML 5?

.main-body-text {
  color: #666;
  font-size: 10px;
  font-family: robotolight, sans-serif;
  text-align: left;
  line-height: 14px;
}

What's your problem exactly ? Your JSFiddle shows that line-height is the same for P and SPAN — Clément Malet, Aug 10 '14 at 07:27
@Clément Malet: change the js fiddle to html 5 in the options — Timothy, Aug 10 '14 at 07:34
Perhaps the same question, perhaps not, but take a look at [why the span's line-height is useless](http://stackoverflow.com/questions/11829393/why-the-spans-line-height-is-useless) — Alohci, Aug 10 '14 at 10:53

score 5 · Accepted Answer · answered Aug 10 '14 at 08:30

Problem is that p and span have different display types, resulting in different behaviors due to hidden spaces between lines.

If you want both of them to have the same line-height, force them to be of the same type :

display:inline; // or 'block' or 'inline-block'

1 Answers1