• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 526
  • Last Modified:

CSS How to center bullet image horizontally

Please visit www.mwebdev.com/ls.html. Take a look at the menu, and the blue/red stars between the menu items.

1.

How can I center the star images between each of the menu links using CSS?

2.

How can I add CSS to add another start to the right of the last menu link (Contact)?

Thanks in advance!
0
isaacr25
Asked:
isaacr25
  • 3
  • 2
4 Solutions
 
wdfdo1986Commented:
This is done using <ul> and <li>
What you could do to align stars center between links, is make the width vary, make a fixed margin. But for me the way it is better.
you can add another li tag to add a menu link inside <ul id="main-menu">

Hope it helps
0
 
isaacr25Author Commented:
Can you elaborate a bit on the last suggestion (adding another li tag)... More guidance would be appreciated.
0
 
Neil_BradleyWeb UX/UI DeveloperCommented:
Rather than add another li tag to the end (to get your last star) you could simply add the star to the ul tag that contains the menu. The star would be positioned to the far right.. So giving you your start at the end..

Aggree with previous post. You can control the position of the stars by adding a fixed margin to one side of your li.
Cheers,
N
0
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
wdfdo1986Commented:
Search for <ul id="main-menu"> in the html and find the ul element.
you will find list of li tags there
add another
0
 
isaacr25Author Commented:
I tried adding a fixed margin to the li's. I had to apply a negative margin to get the horizontal spaces to even out. I'm fine with this.

However, I need to center the entire menu horizontally (it's floating to the left currently.

Also, what tags would I apply to get the last star on the right?
0
 
wdfdo1986Commented:
To align the whole thing add align center to the class "main-menu"
Check these
http://www.w3schools.com/css/css_align.asp
http://www.maxdesign.com.au/articles/center/
0

Featured Post

Get expert help—faster!

Need expert help—fast? Use the Help Bell for personalized assistance getting answers to your important questions.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now