DIV and p (Gaps between them).

Question

I'm sure that I'm missing something really obvious here:
I've attached the CSS that I'm using (external).
Using the WYSIWYG view, it's really hard to get it to do what
I want; I seem to have to ensure that I have a space below where I
want to put anything, check that the format is set to "none", then
I can set "start" - & enter my information. Then I can click in
the space, and do the same before entering the contents for "main".
However, if Dreamweaver helpfully adds some paragraph tags,
as it often does, it gives me a gap between "Start" & "main".
I've also found that if I don't have a blank line after the
bit that I'm trying to put in, then I end up with the insertion
point being unable to get "past" the final div tag, so I end up
with a div in a div, which isn't what I want.
I can use the code view to tweak to what I want, but I can't
help feeling that I'm missing something; either that the CSS is
wrong - so I should be able to have two paragraphs in adjoining div
touching each other, or something!
I'd found
http://archivist.incutio.com/viewlist/css-discuss/39227
- which suggested using div > p - but even though I tried with a
line-height of as low as 0.8 it didn't work, so I've obviously got
the wrong end of the stick (wrong stick most likely!)
Emma

Answer 1

Emma,
> I've worked it out! I don't *need* the div tags.
That's right.
> As long as I use p class = and then enter the text, I
can
> then get two different paragraphs to join & look
like a
> single body!
As a matter of fact, you don't even need class="something".
There are
various kinds of CSS selectors. One of them is known as a
class, which
requires the class="" attribute in your HTML and a dot in
front of the class
name in your CSS.
e.g.
.discussMain = { properties here }
Another kind is known as an element selector. That's where
you simply
use the name of an HTML element, such as p, as your selector.
You don't
need a dot, then, in your CSS for that rule.
e.g.
p { properties here }
Keep in mind, if you use an element selector, *all* elements
of that
type will be affected. If you only wanted to affect a dozen
<p> tags, but
not all, you could either give each of them a class attribute
and use a
class selector, *or* you could wrap all those <p> tags
in another tag --
say, a <div> -- then apply your class to the
<div>. This is partly what the
"cascading" means in Cascading Style Sheets.
<div class="something">
<p>paragraph</p>
<p>paragraph</p>
<p>paragraph</p>
</div>
.something p {
properties here
In the above, the HTML shows a way to corral together a
handful of <p>
tags. The CSS references all <p> tags that exist inside
any element whose
class attribute equals "something".
There are other ways to specify which parts of the HTML
should be
affected. See this Wikipedia entry for a good overview.
http://en.wikipedia.org/wiki/Cascading_Style_Sheets
David
stiller (at) quip (dot) net
Dev essays:
http://www.quip.net/blog/
"Luck is the residue of good design."