How to add vertical stroke to between top menu items?

I have a horizontal Spry menu bar. How to add a vertical stroke between menu top items?
BUT NOT outermost left and outermost right. Only to BETWEEN top menu items.
In html file I tried this:
  <div id="main_menu">
    <ul id="MenuBar1" class="MenuBarHorizontal">
      <li><a href="#">Products</a></li>
      <li class=stroke></li>
      <li><a href="#">Services</a></li>
      <li class=stroke></li>
      <li><a href="#">News</a></li>
      <li class=stroke></li>
      <li><a href="#">Contact</a></li>
     </ul>
   </div>
And in CSS-file I made a style:
#MenuBar1 .stroke
display: block;
width: 1px;
height: 16px;
background-image: url(../images/gui/vertical_stroke.png);
background-repeat: no-repeat;
In Safari this Spry menu bar work fine. But stop working in Firefox and IE.
Also DW4 warning me in properties panel that:
"This menu bar is missing some important tags. Go to Code view and and make sure that each menu item contains an <a> tag."
What is correct method to do this?

In that case you will need to use images.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled</title>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
<style>
ul.MenuBarHorizontal a.line {    background: #EEE url(SpryMenuBarLine.gif) no-repeat 95% 50%; }
ul.MenuBarHorizontal a.MenuBarItemSubmenu.line{    background: #EEE url(SpryMenuBarDownLine.gif) no-repeat 95% 50%; }
</style>
</head>
<body>
<ul id="MenuBar1" class="MenuBarHorizontal">
  <li><a class="MenuBarItemSubmenu line" href="#">Item 1</a>
    <ul>
      <li><a href="#">Item 1.1</a></li>
      <li><a href="#">Item 1.2</a></li>
      <li><a href="#">Item 1.3</a></li>
    </ul>
  </li>
  <li><a href="#" class="line">Item 2</a></li>
  <li><a class="MenuBarItemSubmenu line" href="#">Item 3</a>
    <ul>
      <li><a class="MenuBarItemSubmenu" href="#">Item 3.1</a>
        <ul>
          <li><a href="#">Item 3.1.1</a></li>
          <li><a href="#">Item 3.1.2</a></li>
        </ul>
      </li>
      <li><a href="#">Item 3.2</a></li>
      <li><a href="#">Item 3.3</a></li>
    </ul>
  </li>
  <li><a href="#">Item 4</a></li>
</ul>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</body>
</html>
The images look similar to the following
and
I hope this helps.
Ben

Similar Messages

  • How to add an Icon to a parent menu item in Command Center?

    Hi guys,
    does anybody know how to add an icon to a parent maenu item in Command Center? BTW, I'm using SBO 6.5
    Cheers,
    Oki

    The SDK doesn't provide any features for adding icons to the command center in SBO6.5.
    Version 2004 has a new image property for menu items that can be used.
    John.

  • InDesign CS3; Tables; How to remove vertical stroke??

    Have an 8 column table with 1/2pt vertical stroke/rule between each column. How can I remove/delete only the vertical stroke/rule between column 7 & 8??

    Select your columns.
    In the cell stroke box, click on the strokes to select and set the weight.

  • How to invert vertical slide control from top-down to bottom-up style?

    How to invert vertical slide control from top-down to bottom-up style?
    Actually vertical slide control has default style as the below image:
    I want it to be something like this:
    Sorry for my bad photoshop skill

    Thanks a lot !!!
    It's what I didn't know

  • Reduce spacing between top navigation items.

    My top navigation is a bit too wide for most screens.  Is there a way, via CSS, to ever-so-slightly shrink the spacing between top navigation items?
    Thanks!

    Mike, you are a beautiful human being.  Thank you!  This is precisely what I was looking for.
    I'd love your advice on this one, if you might:
    http://social.technet.microsoft.com/Forums/en-US/sharepointgeneral/thread/29389876-3d83-42ac-857e-c96e588fa4e0/#9c5701d9-edfa-4673-bad0-0ba254c373fc
    Thanks again!

  • How do I make top menu item unclickable but drop downs are clickable?

    I have drop down menu with the top menu item titled "Renderings" and the drop down from that are serveral types of renderings. I don't want the viewer to be taken to a page called "Renderings" when they click that, but I do what them to choose one of the drop down items. How can I make the top most menu item "Renderings" non-clickable? Thank you!

    Right mouse click on the top level page in  your plan view and then mark it as 'Include Without Hyperlink'

  • How do I remove the acronym tags from menu items in Business Catalyst?

    Hello, can anybody answer this for me please? Not having any success googling or foruming it so far.
    How do I remove the acronym tags from menu items in Business Catalyst? 
    Thanks in advance
    Grant

    These are titles and in the dynamic menu will be the item description per item.
    These are actually important though and you do not really want to remove them but make them better and reword them other then the same as the link test. These are good for the user experience as well as SEO. A bot knowing a description of a link and where it is going coupled with the URL's and the title of an anchor are all important aspects of your sites SEO.

  • Adjusting margins between horizontal menu items

    I noticed you can adjust the padding with menu items, but not the margins?  Is there a way to adjust the margins between each menu item ?

    In that case you will need to use images.
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Untitled</title>
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
    <style>
    ul.MenuBarHorizontal a.line {    background: #EEE url(SpryMenuBarLine.gif) no-repeat 95% 50%; }
    ul.MenuBarHorizontal a.MenuBarItemSubmenu.line{    background: #EEE url(SpryMenuBarDownLine.gif) no-repeat 95% 50%; }
    </style>
    </head>
    <body>
    <ul id="MenuBar1" class="MenuBarHorizontal">
      <li><a class="MenuBarItemSubmenu line" href="#">Item 1</a>
        <ul>
          <li><a href="#">Item 1.1</a></li>
          <li><a href="#">Item 1.2</a></li>
          <li><a href="#">Item 1.3</a></li>
        </ul>
      </li>
      <li><a href="#" class="line">Item 2</a></li>
      <li><a class="MenuBarItemSubmenu line" href="#">Item 3</a>
        <ul>
          <li><a class="MenuBarItemSubmenu" href="#">Item 3.1</a>
            <ul>
              <li><a href="#">Item 3.1.1</a></li>
              <li><a href="#">Item 3.1.2</a></li>
            </ul>
          </li>
          <li><a href="#">Item 3.2</a></li>
          <li><a href="#">Item 3.3</a></li>
        </ul>
      </li>
      <li><a href="#">Item 4</a></li>
    </ul>
    <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    </body>
    </html>
    The images look similar to the following
    and
    I hope this helps.
    Ben

  • How to add new row at the top of the advance table.

    Hi,
    I have one advanced table.
    I want to add new rows in advanced table. I can able to add rows using the AddMoreRows button in the footer of the advanced table.
    This adds the row at the end. But I want to add the row at the top.
    How to achive this? Please suggest.
    Thanks & Regards,
    Raja

    Hi,
    Yes you can do it...
    Just set the add Rows automatically property to False of Add Row Button
    and then in processForm Request capture the addRows event
    and invoke a method in AM and then create a new Row in VO.
    Use this code...it will insert row at the top...
    if("addRows".equals(event))
    am.invokeMethod("addrows");
    public void addrows()
    AddressesVOImpl vo1 = getAddressesVO1();
    AddressesVORowImpl row1 = (AddressesVORowImpl)vo1.createRow();
    vo1.insertRowAtRangeIndex(0,row1);
    vo1.setCurrentRow(row1);
    Thanks,
    Gaurav

  • Swing : How to add Key Stroke to JOptionPane

    I want add key stroke(ctrl+K) to JOptionPane, this should work all over application, where ever JOptionPane comes.
    Help me on this.

    Darryl Burke wrote:
    You haven't bothered to reply to camickr's response to your [url http://forums.oracle.com/forums/thread.jspa?threadID=2123891]earlier question. Maybe that's why nobody seems interested in responding to this one.
    db
    Yes, I'm thinking of boycotting people who don't change their user name from the default number assigned to them. It's too hard to distinguish each user now :)
    Its amazing how many new users don't take the time to learn how to use the forum and just start asking questions.

  • Emergency - How to add over 100 asset masters in an item of PR.

    Hi Expert.
    I can add only 100 asset masters in an item of PR.
    But, I have to add over 100 asset master in an item of PR.
    Please, Let me know how to that..
    Thank you in advance.
    best regards,
    kil-nam.

    Dear G.Ganesh Kumar.
    I can't find that.
    Could you send a mail with screen dump, please!!!
    My mail address is [email protected]
    Thank you in your effort.
    Best regards,
    kil-nam

  • How to add Mail to Photos dropdown share menu?

    If I want to share a photo by email (while in Photos), Help tells me to click on the Share icon, then select Mail. My problem is that Mail is NOT on the Dropdown menu.How do I put it on the Dropdown menu?
    I suspect the problem may relate to the fact that I moved from a Windows PC to my Mac and installed a Thunderbird Email client to avoid learning a new Mail interface first thing. Now the Thunderbird icon show on the Photos "Share" menu (although it is grayed out and cannot be selected), and I have long since abandoned Thunderbird in favor of Mac Mail. So it seems reasonable that I need to remove the grayed out Thunderbird icon, and replace it with the Mac Mail icon on the Photos "Share" dropdown menu.
    Any suggestion for implementing that change?

    From the Mail menu bar, select
              Mail ▹ Preferences... ▹ General ▹ Default email reader: Mail

  • How to add Extra tabstrip in ME21 tcode at item level

    Hi Friends,
    I would like to add extra tabstrip in ME21 tcode at item level.
    So what are the screen exits and what are the BADIs available for it, and if possible please give me the steps to implement this change. Good points will be rewarded for suitable answers.

    Hi Pavan,
    Design and code in the following enhancement MM06E005.
    create screen in this screen exit SAPLXM06 & screen no.  0111
    This is the user exit for writing your logic EXIT_SAPMM06E_007  - for export
    EXIT_SAPMM06E_008 for import
    Shylesh

  • Problem when trying to add a link to the left menu item!!!!

    Hi everyone,
    I am trying to put a new menu group on the left menu,with a link in that group for every one.On checking with the customization guide this is what i did
    for one link i did add the following lines in each of the files
    1)xlWebAdmin.properties
    - menuGroup.Misc-Menu=Misc Menu
    - menuItem.Misc-Menu.My-Nomination=My Nomination
    2) xlDefaultAdmin.properties
    - menuItem.Misc-Menu.My-Nomination.link=mynomineefrm?showfrm
    3) repacked the war and the ear
    4) Restarted my server
    When I login into the administration(xelsysadm) page I didnt see any menu item with name "My Nomination" which i am supposed to see.
    secondly it shows the menu item when ever i select some group and click on assign menu item.
    Moreover, when I try to assign this menu item to all users group it gives me this error
    On browser it prints
    Permission Denied to Assign Selected Menu Items
    You do not have the permissions to assign one or more selected menu items.
    on console it prints
    ERROR [SERVER] Class/Method: tcDataObj/eventPreInsert Error :Insert
    permission is denied
    ERROR [APIS] Class/Method: tcGroupOperationsBean/addMenuItems encou
    nter some problems: maoRejections:You do not have permission to insert this obje
    ct.
    ERROR [APIS] Class/Method: tcGroupOperationsBean/addMenuItems encou
    nter some problems: Error occurred while adding menu items.
    ERROR [WEBAPP] Class/Method: UserGroupMenuItemsAction/commitGroupAs
    signMenuItems encounter some problems: {1}
    Thor.API.Exceptions.tcBulkException
    This problem eat my happy sunday :-(, any one has solution for this problem?
    - Also if some one can help on how to link jsp to the new link will be helpful for me!
    Thanks,
    doki

    Design Console > Form Information > add new
    Class Name Organizations.Merge
    Description Move users from one organization to another
    Type menuitem
    Add following to xlWebAdmin.properties, xlWebAdmin_en_US.properties
    Organizations.Merge=mergeOrgs.do?Display
    menuItem.Organizations.Merge.link=mergeOrgs.do?MergeOrganizations
    menuItem.Organizations.Merge=Merge
    mergeOrgs.button.display=Merge Organizations
    Even you have to assign first to System Administrator group
    First go to Manage Group
    Select System Administrator Group
    Select Menu Item
    Click Assign and select newly craeted Menu Item and click Confirm
    These are the steps to see the new menu item. To make this menu item working:
    you'll have to write action class, form bean class and you'll have to create JSPs and make their entry in struts-config as welll as in Tiles-def.xml
    Then your menu item will work.

  • How do I edit and create new Spry2 menu items?

    I have manged to use adobe air to style and insert a spry2 menu - looks OK
    However,I do not undestand how to edit the menu items
    i.e. creating new menu items and adding new sub menu items
    On spry1 it was easy - just click the top of the menu and a wizard appeared at the bottom of the page
    The spry2 menu icon seems to be unclickable/greyed out?
    Can anyone help
    [email protected]

    Thanks for the reply - I already thought of that and I can edit the menu using code view (although I am not sure how you would 'see the sub menus in design view?) but I was wondering if spry2 has the same time saving wizard in the properties panel (as Spry1) that simplifies and speeds up the process?
    To restate the question: I can see a spry2 menu icon in the properties panel but it doesn't do anything as it's greyed out.
    Is there an option in dreamweaver (or adobe air which styles the menu) that makes a menu wizard work in the properties panel?
    If not then I guess I have to do it in code view - very tedious!?
    Jonathan
    [email protected]

Maybe you are looking for

  • Questions about using a PDF form online

    I have a client who wants to create an online version of a PDF form that they are currently using. I am currently trying to explain to them that this would be best done as an HTML web form, but I may not win this argument. I have only used PDFs for p

  • Mac Mini will read from but not write to external CD/DVD drive

    My new Mac Mini won't write CDs or DVDs to my LaCie DVDRW external drive, either in iTunes or through the finder. The computer appears to be writing the disc and then there's an error message right at the end of the process that says it can't access

  • Unix file problem

    Hi gurus,       I am creating program which reads the data from unix file  and print it. but i am having one major problem while reading that data. when i read the currency value from the file it displays #sign every time wht can i do to eliminate th

  • Batch appropriation request?

    hi experts, if i can use shdb or others  to create a batch program for appropriation request,i have tried shdb,but strangly after i click the 'create buttom',the processing is finished best regards zlf

  • FM to know opeartion performed on infotype record...

    Hi Friends, In my requirement i have to display the infotype change logs for each pernr. i.e the infotype records that are changed or deleted or inserted. can you please suggest me the function module or table which gives these details. i.e operation