Indent on menu items

Taken From The Forum:
Forum Topic:
Last Updated: Saturday July 14 2012 - 06:07:20

Indent on menu items

Poster: cubefree
Dated: Monday August 11 2003 - 22:27:23 BST

Wondering if anyone has found a way to indent sub-menu items? See URL below to assess the need.

I have a mainmenu that includes a submenu (to show state of where the user is at)... I know this is not the way it was intended to be used.

I can use an image to indent text, yes. But what then if your text wraps once, or again. Then under this solution you must add other images to get the indent. You must!! If you want an overimage attribute.

Of course, also possible is adding the nobreakspace char with the BR tag. But I am hoping to automate this later without having to do a character count.

You can see the quandry here. http://www.cubefree.com/clients/provide ... ccount.htm

Thanks.
Cubefree

Poster: Hergio
Dated: Tuesday August 12 2003 - 13:25:10 BST

Off the top of my head, I don't know if the menu has a feature that supports this right out of gate. But here are two ideas to try....

First, put everything in a span tag and give it a style attribute that will change its left margin or padding, that way everything in the span tag, whether its on one or two lines, will be moved over from the left.

Code:

aI("text=<span style='padding-left:10px'>Menu<BR>Item</span>;url=www.blah.com");

The second idea is to use a table and this will allow you to have sometihng like an image on the left hand side. Basically make the table two columns, one row. Put an image in the left cell (it can either be an image or a transparent pixel whose size you can tweak to be just right) and in the right cell you put your text.

Code:

aI("text=<table width=100% ><tr><td><img src='transpx.gif' width=20></td><td>This is some text<BR>some more text</td></tr></table>;url=www.blah.com");

If you understand what I mean, let me know how that go. Otherwise I can try and explain further. And just a word of caution, where I put in the width of the table (100%), make sure the percent symbol and the closing greater-than symbol of the table's tag have a space between them (100% >). I picked up you are using ASP and if they are together, it might confuse the ASP parser.

<div> is going to work better

Poster: cubefree
Dated: Wednesday August 13 2003 - 0:57:39 BST

Thanks very much! This put me in the right direction.
I think a <div> is going to work better.

Code:

e.g. text=<div class='rightinfo'>Lorum ipsum dolor sit </div>;

The problem with the table tag in my design case is you don't get to use the image property (e.g. image=graphic.gif) of the software, which means no overimage property either which is nice.

I tried the following, (and overimage does not work then):

Code:

aI("text=<table width=100% border=1 cellpadding=0 cellspacing=0><tr><td valign='top'><img src='images/interior/bullet_off.gif'></td><td><a class='tertnav' href='valueplan_your_account.htm'>Your Value Plan Account</a></td></tr></table>;overimage=images/interior/bullet_on.gif;separatorsize=0;showmenu=subMenu;");

Also good call on the ASP % > comment!

Thanks a million Lire!
cubefree

Industrial Strength JavaScript and DHTML Menus

Indent on menu items

<div> is going to work better