Old Question: How do I center the doge picture.
Answer: (See below) I changed the margin of the nav, so it empties the space for the centred picture.
2 Steps I did: 1st: clear the bottom margin of nav
2nd: as a lot of people pointed out to me, I need to add margin:0 auto; to my picture.
New question:
How come my "About Me " does not respond when it typed in “margin:0 auto” in css??
Here is the updated code.
Hi,
To move your image below the text:
The order of your HTML is important. Your web page will reflect how you have written your html. So if you have your image before your paragraph in html, thats how the page will look too.
So, just cut the whole image tag and paste it after the last closing </p> tag in your html.
To center your image
First remove the styles from your img and give it the id of “dog” or anything you want.
<img src="https://cdn.thinglink.me/api/image/727110550026190849/1240/10/scaletowidth" class="img-responsive" alt="so doge, much cuteness,wow" id="dog" >
Now apply the following rules and your image will be centered and sized as you wish.
#dog{
width:100px;
height:100px;
margin: 0 auto;
}
the # before dog tells the CSS that it’s looking for an ID within your HTML. The dog bit is a unique identifier for that image, so these rules will only apply to that single pic. To apply a rule to multiple pics, you would use a class instead of ID
In which case you’de use class="img-responsive dog" and your rule in CSS would have a dot instead of a hash/pound.
What the margin 0 auto rule is doing is saying, no margin on the top and bottom, and automatic left and right margins. The auto will result in equal margins on either side of the pic within its container. The container is the whole body in this case. You can change the 0 to a px value (10px or whatever) and that will give you a bit of margin on the top and bottom, which in most cases you will want a bit of separation between things.
It’s better practice, and more manageable, if you keep your styles out of html and inside the css section and a good habbit to get into.
Cheers
Mark
I updated my code… but now the image is still not centred…
I don’t know why… I cleared some of the styling I did in HTML. Bad habit . I will keep that in mind.
Guys false alarm… My nav bar has too much margin… I now successfully centred the image… LOL
Thanks for your help!!!
Guys now I can’t move "About Me " to the center of the page…
like this:
.first{
text-align: center;
}
I tried align:center; LOL. Thanks for the help, again! 
Tomorrow I am gonna replace that doge photo to mine. HOHO.
XD
Good night! It is 23:40 here.
no probs, @zhouxiang19910319
Just a thought, since FCC only touches on HTML/CSS/Bootstrap - it’s a good idea (if you have time and inclination) to supplement with some external resources.
23:40? middle of the day! 