Working with divs

100px x 200px
line height of 1

Line height of 3 doesn't affect div dimensions

Margin added to p element doesn't affect div dimensions

Margin added to div itself affects div placement and space it takes up but not dimensions

Padding added to div affects div dimensions

Adjusting text spacing

There are three possible ways to adjust spacing between lines and paragraphs of text.

line-height — changes distance between each line; line height will limit how close you can get two lines of text if you set their margin and padding to zero.
margin-top and margin-bottom — affects distances between paragraphs, margin-collapse occurs between paragraphs, margin is zero between text and edge of div.
padding-top and padding-bottom — affects distance between paragraphs; no "margin collapse" affect.

Adding margin vs. adding padding

Here's specifying 12px margin around h3 and p:

You will need to add padding to top and bottom of div to fix spacing.

Entus sitate sit inctia plam, odit et fuga. Ipit veniendia et volum.

In porrum accupta tetur, cuptam fuga. Parum dunt ut autasse esende pa dolupiciatio in et lamus eumquis abores veliamus serferi busapellab idellau dignimetur, sim ea volorem poremporatur alis alitas ut exerum dit, vendae nis rero deligniendis simus il inimolupici tempore ctatem.

Here's specifying 12px padding around h3 and p:

There's now space between the top and bottom of the div and the text, but you don't want the space between the top and bottom of the div and the text to be smaller than the space between paragraphs within the text, so you'll still need to add some padding to the top and bottom of the div to make it look right.

Entus sitate sit inctia plam, odit et fuga. Ipit veniendia et volum.

Pay attention to how subheads are spaced

Pay attention to inter-paragraph spacing, as demonstrated below. All of this is easier for the web than for print, as web elements have even spacing top and bottom "out of the box;" we have to change the margin or padding for h1s, h2s, etc. to look different than the equal distance Subhead #2.

Subhead #1 — little space above, lots of space below

If the space above the subhead is less than the space below the subhead, the subhead will be confusing to the reader because it will appear to belong to the paragraph before it.

Et acepe volum ipita volenes cimust rem que evero odipsumquia cullorr oritatio temque natest, sunto beribus volo moloriberiam in et ut aspelique minctas quatuscium verum que et volupta tissequides nobit vidit peratiis doluptaecus que pore vitas del il ium explatur, sinulle ndipsapistia sitae arci in pedis earit odia quas illiquatur ad eaquis eos delecae. Entus sitate sit inctia plam, odit et fuga. Ipit veniendia et volum.

Subhead #2 — equal space above and below

If there is equal distance above and below the subhead, there will be a relaxed, even flow to the text, but there also won't be a "mental break" from the text above and the subhead won't definitively belong to the text after it.

Exeritemqui cuptaquia aperum quis audae maximaxim quatusandem ipsum re vitatur sit quasperro volupta testius animus modiae sequi res volupta ex et et aut vellabora volorati dolorrorrum que molore sitasi ulparumquia pliquam, vitemperatem a necus, officaes dit, sit as ercimin vellaut eaquam reicil ius volupiciis consecto cumqui con pro officilla quiam.

Uptatis ad ut ilit et omnis dolupta spitaspe volutet maiosa doloribusdae omnimin torepedit, odi officia tibeatur, natatur, quis aborum que essimagniet diam idit la quia vellisquam, sedi sam lam eos veles arias etur arum iuria eos autempor moluptae maiorerro voluptatiur?

Subhead #3 — lots of space above, a little space below

If there is more space before the subhead than after it, there is a slight "mental break" from the last bit of information and the subhead will easily be identified as belonging to the text that comes after it.