I cant center images

HTML-CSS
1

I’ve tried every guide on the internet on how to center images, can somebody please look at my code and tell me where I screwed up.

html:

<div id="title"

Sean Connery

The best James Bond

Sean Connery as James Bond

  • 1930-Born in Fountainbridge, Edinburgh, Scotland
  • 1943-At the age of 13, he quit school to earn money for his family and got a job as a milkman in Edinburgh.
  • 1946-Joined the Royal Navy
  • 1953- he traveled to London and took part in Mr. Universe contest on persuasion of his gym friends. He was suggested by one of his competitors to audition for the stage production of ‘South Pacific’. He gave the audition and was selected for a role of one of the Seabees chorus boys in it.
  • 1957-he did minor roles in some of the movies including ‘No Road Back’, ‘Action of the Tiger’ and ‘Time Lock’.

css

#main{
background-color: gray;
}
#tribute-info {
}
#title {
text-align: center;

p {
text-align: center;
}
#img-div {
width: auto;
margin-left: auto;
margin-right: auto;
display: block;
}

2

I tried to paste my code up there anyway

4 
  <!--source https://www.thefamouspeople.com/profiles/sir-thomas-sean-connery-2823.php-->
  <div id="title"
  <h1>Sean Connery</h1>
  <p>The best James Bond</p>
</div>
<div id="img-div">
  <image id="image" src="https://s3.amazonaws.com/s3.timetoast.com/public/forum/uploads/photos/4412805/1129299607_8477.jpg?1475013996"></image>
  <p id="image-caption">Sean Connery as James Bond</p>
</div>
<div id="tribute info">
  <ul>
    <li><strong>1930-</strong>Born in Fountainbridge, Edinburgh, Scotland</li>
    <li><strong>1943-</strong>At the age of 13, he quit school to earn money for his family and got a job as a milkman in Edinburgh.</li>
    <li><strong>1946-</strong>Joined the Royal Navy</li>
    <li><strong>1953-</strong> he traveled to London and took part in Mr. Universe contest on persuasion of his gym friends. He was suggested by one of his competitors to audition for the stage production of ‘South Pacific’. He gave the audition and was selected for a role of one of the Seabees chorus boys in it.</li>
    <li><strong>1957-</strong>he did minor roles in some of the movies including ‘No Road Back’, ‘Action of the Tiger’ and ‘Time Lock’.</li>
    <li><strong></strong></li>
    <li><strong></strong></li>
    <li><strong></strong></li>
    <li><strong></strong></li>
    <li><strong></strong></li>
    <li><strong></strong></li>
    <li><strong></strong></li>
    <li><strong></strong></li>
    <li><strong></strong></li>
    <li><strong></strong></li>
    <li><strong></strong></li>
</div>
</main>


#main{
background-color: gray;
}
#tribute-info {
}
#title {
  text-align: center;
  
p {
  text-align: center;
}
#img-div {
  width: auto;
  margin-left: auto;
  margin-right: auto;
  display: block;
}
5

Right now I am using the center html tag, but I feel dirty doing it, and I need to figure it out with CSS

6

You have many html syntax errors which are causing things not work as you expect.

#1) Make sure your opening div tags look like <div>. You can have attributes inside them, but make sure not to leave off a < or a >. Your first opening div tag is missing a >.

#2) There is no such thing as a image element. There is an img element though, but they do not have a </img> (see below)

<img id="image" src="https://myimageurl.com/image.jpg">

#3) Double check that all of your CSS selectors start with a { and end with a }. One of your selectors is missing a }.

1 Like
7

Thanks I think have of that stuff happened because I was deleting and typing in different things and throwing the keyboard across the room a few times. The image tag I’m not sure about, it seemed to work I think I looked it up in a book I have laying around from 1996 on html. I appreciate your help. I fixed all of that stuff and a few more I noticed.