CSS float center hack possible with a bit of JS

I have a problem with keeping things in the centre. Bullets for a picture gallery are positioned inside an absolute navigation system primarily controlled by a position:absolute attribute on the container with a width:968px;

There are an unknown number of pictures. If there are 8 there will be 8 bullets, 4, 4 bullets etc... The bullets need to be floated to ensure that they are inline with each other, but since their is no float:center t开发者_开发百科hen I cannot accomplish the central position.

Is their a nice clean CSS solution to this or would it be best to use a bit of JS to detect the quantity of bullets and then position accordingly.

Example -- http://www.golfbrowser.com/courses/wentworth-east/

Any ideas,

Marvellous

Try the following:

.nivo-controlNav {
    display: inline-block;
    position: relative;
    top: 420px;
}

.nivo-controlNav a {
    background: url("http://www.golfbrowser.com/images/structure/bullets.png") no-repeat scroll 0 0 transparent;
    border: 0 none;
    float: left;
    height: 22px;
    margin-right: 3px;
    position: relative;
    text-indent: -9999px;
    width: 22px;
}