Important Notice from AspDotNetStorefront
It is with dismay that we report that we have been forced, through the action of hackers, to shut off write-access to this forum. We are keen to leave the wealth of material available to you for research. We have opened a new forum from which our community of users can seek help, support and advice from us and from each other. To post a new question to our community, please visit: http://forums.vortx.com
Results 1 to 4 of 4

Thread: Menu item text wrap

  1. #1
    hha is offline Junior Member
    Join Date
    Aug 2011
    Posts
    11

    Default Menu item text wrap

    Suggestion on how to best wrap a menu item on a horizontal navigation?

    For instance, if the menu header is something like,

    "product type category one" to display it like

    "product type
    category one"

    The menuData.xml sets the horizontal nav header and links them to the product category pages.

    Tried white-space and other options on the style, template, menuData, no luck so far.

    Thanks in advance.

  2. #2
    Orangey is offline Junior Member
    Join Date
    Aug 2010
    Location
    UK
    Posts
    23

    Default

    Have you tried <br> ?

  3. #3
    hha is offline Junior Member
    Join Date
    Aug 2011
    Posts
    11

    Default

    on menuData.xml??

    test <br> on menuData.xml, when putting <br> between the text it disables the rest of the line

    sample nav header line
    <SiteMap>
    <item Text="product type category one"" NavigateUrl="product-type-category-one".aspx" />

  4. #4
    hha is offline Junior Member
    Join Date
    Aug 2011
    Posts
    11

    Default

    the solution...

    Edit menuData.xml and style.css files.

    <item Text="product&#xA0;type category&#xA0;one" TextWrap="true" TextAlign="center" NavigateUrl="product-type-category-one.aspx" />

    before:
    product type category one

    after:
    product type
    category one

    Linking the text with "&#xA0;", xml special character, helps specify where to wrap the text, without the "&#xA0;", displays four lines of wrapped text for every space between the texts.

    Then you may further edit the presentation on the css side.

    Glad to test alternative approach as well.
    Last edited by hha; 08-16-2011 at 08:46 AM.