The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Slanted text in a nav bar

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • #32774


    This seems to be a place full of CSS experts so I thought where better to get help with my query…

    I’m making a site for someone. The navigation bar is a horizontal coloured bar across the top of the page. The text is slanted under this bar (like a tube map for example). I’m using sprites to get the page name to change appearance on rollover.

    see here

    (note only the childcare link will work…this is just a live test page, the site isn’t ready to go fully live yet.)

    This is working (mostly) but I wanted the coloured bar (running the full with of the page) to change colour all the way from the very left to the point of the current page with a small round ball at the end. Basically I need the image of the coloured bar to change accordingly as the user hovers on each page name but I don’t know how to do this…especially not with sprites..

    Would love some help/advice on this.

    Thanks in advance.



    Nice design!

    I think that using a sprite image with all of your bars and then changing the position of the image on hover should do the trick.


    have a background image for each anchor, positioning it outside of the anchor tag and then making it appear only on hover would work too, with that option you can even use css3 transitions and make it look hot!!!

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘CSS’ is closed to new topics and replies.