How come [div line-height] is different from [p line-height]?

[asasass]

Does line-height get used in one, and not the other?

Edit fiddle - JSFiddle - Code Playground

How come:

<div style="line-height:122px;

is equivalent to

<p style="line-height:83px;

[felgall]

@asasass

is equivalent to

It isn’t. It might look like it for a given amount of text and given margins and padding but change any of those and it will be completely different.

You really need to learn what the various HTML tags and CSS commands mean instead of keep asking why two completely different things just happen to look the same in the one in a trillion combination you are using.

[ronpat]

Without looking at your fiddle, the two snippits with line-height that you have posted are not equivalent. Paragraphs also have default vertical margins measurable in ems which look like you are including them in the vertical height being measured.

<aside>
I feel reasonably sure that you have been advised to use unitless line heights for paragraphs and indeed for most text. There are appropriate uses for pixeled line-heights, but not often.

http://www.slideshare.net/maxdesign/line-height
</aside>

[asasass]

What’s the proper way of pushing text down?

Edit fiddle - JSFiddle - Code Playground

line-height 114px
padding-top:44px;
or position: relative;bottom:-44px;

[felgall]

@asasass

What’s the proper way of pushing text down?

It depends on the reason you have for wanting to re-position it. Line-height increases the spacing between rows of text while padding-top will move all the text down without moving the individual lines wider apart and position:relative moves the content while leaving the container where it was (which you don’t normally want to do).

[asasass]

The only reason I have is because I want it lower on the image, that’s all.

Edit fiddle - JSFiddle - Code Playground

So, then which method would I use?
line-height 114px
padding-top:44px;
or position: relative;bottom:-44px;

[asasass]

What’s wrong with moving the content while keeping the container in-place? I don’t see why that would be a bad thing.

[felgall]

@asasass

What’s wrong with moving the content while keeping the container in-place

Because then the content can overlap on the other content in other containers in the page.

[asasass]

ok, so then line-height would be the best option to move text lower.

[ronpat]

@asasass

ok, so then line-height would be the best option to move text lower.

… as long as the text never needs to wrap.

[asasass]

and, if you need it to wrap, the only alternative is padding I see.;

[ronpat]

@asasass

and, if you need it to wrap, the only alternative is padding I see

There are several alternatives. They are all covered in an HTML/CSS 101 course.