html - How do I center the content of this website? -

So I'm doing a website for an assignment and for some reason I can not seem to align the content Website. It's a simple layout, it's pure content, no sidebar or anything. Here's the HTML for the content:

  & lt ;! - Start content column - & gt; & Lt; Div id = "content" & gt; & Lt; Img src = "img8.png" style = "width: 460px; height: 100px;" Alt = "Pokémon" & gt; & Lt; Br> Pokuman: First Movie & lt; Br> Soundtrack & lt; / Div & gt; & Lt ;! - Last content column - & gt;   
  
 And here's the CSS:  
  body {background: black; Font-family: Trajan Pro, Ariel, Helvetica, Sense-Serif; Font-size: 28px; Text align: center; Background-image: url ('img2.jpg'); Double-repeat: repeat-x; Background-position: bottom center; Background-size: 460px 300px; } #content {float: left; Color: # 333; Limit: 1px solid # ccc; Background: Transparent; Margin: 0 auto; Height: 1024px; Width: 460px; Display: Inline; }   
 Thank you in advance to all of you. I am trying to align the contents of the image in the background image so that I can become like a fading effect, but the material can not be centered.   
 
 
 All that you should have done  float: left;  and  display: inline;  to  #content  CSS selector.