Loading...
 
Skip to main content

Tiki Design

Forum List Topic List

 
Thread actions

    • Menu Separators

    Posted by Kent Barrett on Thu 06 of Jan, 2011 14:24 GMT-0000 posts: 6 Canada

    I thought the separator menu option would do what I want, but apparently it's just a logical thing and not an object you can css, is that correct? Please tell me it's not.

    What the client wants is this

    Link 1 | Link 2 | Link 3

    She has this on her existing site which was hand made. Any way to do this without putting html in the menu title?

    I tried putting a css border-right on the span.menutext, for example, but that doesn't work because the final menu item would have one also, and you're stuck with the type size.

    It would be nice to have a way to stick in separators that could be any arbitrary thing or an image.

    Cheers!

    Reads: 9926
    Posted by Gary Cunningham-Lee on Wed 12 of Jan, 2011 01:51 GMT-0000 posts: 254 Japan

    The separator item in menu admin is just a logical thing. IIRC, it causes a break when you want to place an option item as a new top-level item rather than under a section.

    A standard practice to get the appearance you're describing is to use CSS to put a border-left on all the links, and then use the :first-child pseudo-class to remove the border on the first menu item. A quick Google turned up this example: http://tobto.org/css-design/modern-separators-in-lists-menu/. This may not be supported by IE6 without some extra effort though, so alternatively you can remove the border on the first item by finding its class/id in the page source and targeting it with its own CSS rule.

    -- Gary

    Posted by Kent Barrett on Wed 12 of Jan, 2011 02:13 GMT-0000 posts: 6 Canada
    Gary Cunningham-Lee wrote:
    A standard practice to get the appearance you're describing is to use CSS to put a border-left on all the links, and then use the :first-child pseudo-class to remove the border on the first menu item.

    Ah sooo. Cheers,

    -Kent