How to add spacing between two text line?

[irock]

Hi, i have a code similar to this one.

<a href=/><font class=path>Domain</font></a><img src=/templates/images/arrow.gif vspace=2 hspace=4><br />

<img src=/images/white.gif vspace=2 hspace=4><br /><h1>Main topic</h1>

I was wondering what CSS is needed to add some space margin for the "Main topic". I tried margin-top but didn't work. That's why I created a white.gif for this purpose.

Thanks.

[Ingolemo]

<h1 style="margin-top:1em;">Main topic</h1>

[doodlebee]

First of all - what Doctype are you using? Youv'e got a mishmash of different valid elements there that aren't needed.

If you're planning on using CSS, you should select a doctype and stick with it. It looks like you're using HTML straight up, so you need to be sure you've got the correct doctype and your code validates - otherwise you're looking at a lot of weirdness occurring when browsers get theown into quirks mode.

That being said...

H1 tags already have margins on them. I'm guessing they're being stripped because of invalid code and deprecated tags. The example below *should* be written more like this (and I'm using XHTML 1.0 Strict doctype, because that's what I'm used to using...)

<a href="#">Domain</a>
<img src="image.gif" width="10" height=5" alt="this is an image" />

<h1>Main Topic</h1>

See the removal of all of that bloated and unecessary code? That's the nice thing about CSS - you can get rid of the extra markup and look at the actual content.

The CSS for above would be:

a, a:link, a:visited {
color:#C00000;
font-weight:bold;
text-decoration:none;}

a:hover, a:active {
color:#000;}

img {
border:none;
padding:0;
margin:0;}

h1 {
font-weight:bold;
font-size:2em;
color:#000;
margin:20px 0;
text-align:center;}

That's just an example.

If I were you, I'd head on over to w3schools.com (it's a starting point) and take a couple of online tutorials for writing (X)HTML and CSS - you're asking a very basic question here that could easily be answered by trying an online tutorial or two :)

[irock]

So embarrassing... lol... but thanks much for your help! Any suggestions for a good CSS book?

[doodlebee]

not embarassing ;) Believe me, everyone here learns something new all the time - I bet even the mods do on occassion ;)

I've never used a CSS book - just tutorials online and self-learning things. but I *do* know those series of O'Reilly books are excellent reference material (if not a little technical)...and I *believe* Eric Meyer has a book out on CSS - Eric Meyer is *definitely* a good person to get info from. He's even got a CSS list that rocks. Google him, and you'll find tons of info :)

[irock]

Sorry I have to go back to the original topic.

In my CSS, I have this. I added the margin part but didn't see the effect I desired.

h1 {
display: inline;
letter-spacing: -1.5px;
font-family: Helvetica, Arial, sans-serif;
color:#225F9E;
font-size: 21px;
font-weight: bold;
margin:20px 0;
}