Left Margin question

Poster: kelemvor
Dated: Thursday January 29 2004 - 4:27:19 GMT

Howdy,

I'm working on a menu with set sizes of each item to work with a background image. I want to have every item have the equivalent of 2 spaces between the edge of the "cell" and the text.

Sample at:
http://www.geocities.com/boom33/menu.htm

If the menu item is just one line, I can just put  2 spaces in front of it and it works fine. But if the words wrap to the second line, then only the first line is indented. I don't want to have to hard code line breaks so I'm looking for some other solution that can be set in the Style area preferably.

Setting the Margin for the Menu movs everything over including the background image which I don't want. I tried using padding but that padded it on the side and the top which pushed the text down too far.

Basically I just want each item to have a left margin of XX or somehow to have the text offset from the edge. Hope that makes sense.

THanks.

Poster: kevin3442
Dated: Thursday January 29 2004 - 5:43:02 GMT

Howdy back,

As far as I understand it, the margin property is only effective as a menu property and would be used to add a margin around the entire inside edge of the whole menu, rather than around each individual item (despite its appearance in the quick refs for style properties and menu item properties, it doesn't seem to actually apply when used as such, only when used as a menu property). So, I don't think that'll be useful to you.

On the other hand, the padding property should work. padding can be used as either a style property (which is probably where you'd want to set it) or as a menu item property. It seems that most folks use padding by assigning a single numeric value, like padding=5;. When used that way, as you've seen, it adds the designated number of pixels symetrically, around all sides of the menu item. But what many don't realize is that, like its CSS namesake, the padding property can also be used to set the padding for each side individually, by specifying multiple values in a string, in the order: top, right, bottom, left (just like CSS, which I imagine is how the menu applies this property internally). For example, this:

would set the padding for each side as follows: top=5, right=10, bottom=15, left=20. Default measurements are in pixels, although you could also specify units of measure (padding="5px 10px 15px 20px"; ... or pt em cm mm...). You would probably do something like

to add just a little more padding to the left side... with the values adjusted to your needs, of course. This will not be a problem for line wrapping.

Hope that helps,

Kevin

Poster: kelemvor
Dated: Thursday January 29 2004 - 13:24:09 GMT

PERFECT!! THat's exactly what I was missing with the padding thing. GOt it workig perfectly.

Thanks!