specify element space from top

[Buppy]

Hi,

I have this following HTML:

...
    <td>
        <div style="position: relative; top:0;"></div>
        <div style="position: relative; top:20px;"></div>
        <div style="position: relative; top:40px;"></div>
    </td>
...

In this case the top value is counted from each div. I need it so that the top value is counted from <td> top, not the previous div as it makes an extra gap between each div. What's the best way to complete this?

Thanks

[simplypixie]

Firslty - you should keep your styling separate rather than putting it inline so move all styling into a style sheet. Then all you need to make a gap between your divs is to use padding or margins:

// In your stylesheet add a class (name what is relevant to you)

.classname {
    margin-top: 20px;
}

Then for the HTML (would be good if you could layout with CSS rather than tables but that is another issue):

<td>
    First line of text here (no div required)
    <div class="classname"></div>
    <div class="classname"></div>
</td>

[almostbob]

you do realise that unstyled divs, are 100% width of the containing element and display as block
in otherwords, all you need is

<div></div>
<div></div>
<div></div>
<div></div>