• 0
Sign in to follow this  
Followers 0

Want unique icon on each li

Question

Posted · Report post

Hi, Please tell me how can I put unique icons for each list item. Please visit www.trendorg.co.uk and see the 'Best of Us' section. I want each list to have a unique icon like the following image; oGB3A.jpg

Share this post


Link to post
Share on other sites

1 answer to this question

  • 0

Posted · Report post

Hi Graham, Each menu item is given a unique ID (see image below). http://www.screencast.com/t/O77JNnrKKA You can use these ID's to add images to each menu item. For example, to add an icon/image to the Sample Page menu, you would use this: [code].menu-item-33 {} <---- Sample Page ID .menu-item-71 {} <---- Page 2 ID[/code] What I would recommend you is, you use this [url="http://www.trendorg.co.uk/wp-content/uploads/2012/04/list_back.png"]image[/url] to create a sprite, add each icon you want to use on the menus and then using the CSS above as a guideline, use the background-position to postion the icons into place. Below is an example: http://i.imgur.com/hWNj3.png This may help you - http://www.w3schools.com/cssref/css3_pr_background.asp

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0