Grow your CSS skills. Land your dream job.

Add a dash to WordPress submenu

  • # June 16, 2013 at 3:36 pm

    Hi,

    I have been working on this website with WordPress

    [website](http://dac.planbfootball.com/ “website”)

    And think I have got most of it sorted now regarding responsive design !!

    But I wanted to add a dash (-) before the submenu links so when on a smaller screen the visitor will now what parent the submenu is under.

    Now I know how to do this when coding on a static site but how the hell do i do this on a wordpress website ??

    Thanks in advance.

    # June 16, 2013 at 5:13 pm

    Well, you could do it with a `:before` selector. Something like:

    ul ul li:before {
    content: “-”;
    }

    # June 25, 2013 at 2:56 pm

    @TheDoc
    Thanks for the reply but I cant seem to get that to work !!

    # June 25, 2013 at 2:59 pm

    Here’s an example: http://codepen.io/ggilmore/pen/29d763d449a42a27f7d24759c5e6e4e4

    # June 25, 2013 at 3:00 pm

    I don’t see you putting @TheDoc‘s suggestion anywhere in your CSS files. Hard for us to figure out why you can’t get it to work that way…

    # July 17, 2013 at 5:39 am

    Thanks for the demo @TheDoc. I have managed to do this now with a bit of help. I dint really explain it properly.

    I was tryng to have the dash just on mobile size devices and not on desktop.

    # July 17, 2013 at 5:42 am

    >I was tryng to have the dash just on mobile size devices and not on desktop.

    A media query should deal with that.

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".