Spacers

[Crump]

I need a spacer in a layout, and I can't attach a margin to any other element. I need something like the old spacer GIF's.

This is what I have:

<div style='font-size: 10px'>&nbsp;</div>

For a 10px space. Is there a more prefered method?

[Kufu]

Why 'font-size'?

Do this:

<div class="width:10px;">&nbsp;</div>

or if you really want to make sure there are no problems, just use a 10-pixel-wide image.

[encyclo]

In your above example, though, your

div

must have block elements before and after it, so I'm intrigued why you can't set the gap with a margin. Could you give an example of the markup you are using? I just can't figure out why you would ever need to do this.

[Crump]

I will try to explain. I have a PHP generated script that generates a list:

Item 1

Item 2

Item 3

Item 4

Each item is the same CSS class. I would like spacing between the items, but not above the 1st and and not below the last one (in this example it is 4, but could be more).

If I set a margin for the class, it will apply to both the first and last element. If I put a spacer in between it works (I use a PHP code to not put it after the last one).

I realize the spacer method is obsolete, and I had the same thoughts as you "there is no way I need to do that in this day and age".

Any thoughts on how I can do it without using a spacer?

[katana_one]

Try applying a 10px margin to the bottom of your <li> tags. Then, if you need to, apply a margin of -10px to the bottom of the <ul>.

I did a quick test in IE, tho. And IE at least, did not apply any extra space after the last <li> tag. Test in other browsers to make sure.

[Crump]

I wasn't using ul or li tags. It's not really a list, it is a series of forms (text inputs).

[Fotiman]

The concept is still the same. Apply the margin to whatever the "item" is, then apply the negative margin to whatever contains those items. Alternatively, give the last item in the list an id and apply a style to that to reset the margin.

[jeffroy]

I have the same problem but using inline (not block) elements.

I have a string of number links denoting pages, like:

1 2 3 4 5 ...

this could go as many as 200 and span over 2-3 lines.

problem is when I try set vertical padding or margin, they are ignored.

what should I do?