How to center a (background) image within a div?

Question

Is it possible to center a background image in a div? I have tried just about everything - but no success:

<div id="doit">
  Lorem Ipsum ...
</div>

//CSS
#doit { background-image: url(images/pic.png); background-repeat: none; text-align: center; }

Is this possible?

Answer 1

#doit {
    background: url(url) no-repeat center;
}

Answer 2

try background-position:center;

EDIT: since this question is getting lots of views, its worth adding some extra info:

text-align: center will not work because the background image is not part of the document and is therefore not part of the flow.

background-position:center is shorthand for background-position: center center; (background-position: horizontal vertical);