# Tribute page: issue with text-align:center

**URL:** <https://forum.freecodecamp.org/t/tribute-page-issue-with-text-align-center/267287>\
**Category:** General\
**Created:** [March 25, 2019, 7:51pm UTC](https://forum.freecodecamp.org/t/tribute-page-issue-with-text-align-center/267287 "2019-03-25T19:51:53Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![sebestyenboglarka](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/sebestyenboglarka/32/198021_2.png) [@sebestyenboglarka](https://forum.freecodecamp.org/u/sebestyenboglarka)\
**Post date:** [March 25, 2019, 7:51pm UTC](https://forum.freecodecamp.org/t/tribute-page-issue-with-text-align-center/267287/1 "2019-03-25T19:51:53Z")

</div>

Hi! I tested my page on codepen and I had a problem regarding the layout:

“2. The ![]() element should be centered within its parent element.”

It looks that I have managed to correct it since it came back 100% correct, meaning all the requirements were met, however my image (in Chrome) and the image caption still doesn’t show centered. I feel unsure of my “code” in this section:

#img-div{  
height:auto;  
max-width: 500px;  
text-align: center;  
padding: 6px;  
}

#img-div img{  
display: block;  
height: auto;  
margin: auto;  
max-width: 100%;  
}

I want to leave the website as simple as it is now, I’m just concerned about the image centering, I hope someone can help me out. I use Brackets, if that’s relevant information.

Here is the whole project: [https://codepen.io/musicianATswampCastle/pen/oVVrMX](https://codepen.io/musicianATswampCastle/pen/oVVrMX)  
Thank you!

---

<div class="post-metadata">

**Author:** ![shimphillip](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/shimphillip/32/158663_2.png) [@shimphillip](https://forum.freecodecamp.org/u/shimphillip)\
**Post date:** [March 25, 2019, 7:57pm UTC](https://forum.freecodecamp.org/t/tribute-page-issue-with-text-align-center/267287/2 "2019-03-25T19:57:02Z")

</div>

you can give your #img-div

`margin: 0 auto;`

This will horizontally center your img-div.

---

<div class="post-metadata">

**Author:** ![sebestyenboglarka](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/sebestyenboglarka/32/198021_2.png) [@sebestyenboglarka](https://forum.freecodecamp.org/u/sebestyenboglarka)\
**Post date:** [March 25, 2019, 8:00pm UTC](https://forum.freecodecamp.org/t/tribute-page-issue-with-text-align-center/267287/3 "2019-03-25T20:00:02Z")

</div>

Thanks, @shimphillip, it worked in the browser and on codepen as well 🙂

---

<div class="post-metadata">

**Author:** ![shimphillip](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/shimphillip/32/158663_2.png) [@shimphillip](https://forum.freecodecamp.org/u/shimphillip)\
**Post date:** [March 25, 2019, 8:07pm UTC](https://forum.freecodecamp.org/t/tribute-page-issue-with-text-align-center/267287/4 "2019-03-25T20:07:18Z")

</div>

No Problem!

Just want to let you know that your image is broken on codepen for other people.

You will need to use a different source to host your image for others to see it.

---

<div class="post-metadata">

**Author:** ![sebestyenboglarka](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/sebestyenboglarka/32/198021_2.png) [@sebestyenboglarka](https://forum.freecodecamp.org/u/sebestyenboglarka)\
**Post date:** [March 25, 2019, 8:27pm UTC](https://forum.freecodecamp.org/t/tribute-page-issue-with-text-align-center/267287/5 "2019-03-25T20:27:05Z")

</div>

Fixed! 🙂

---

<div class="post-metadata">

**Author:** ![shimphillip](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/shimphillip/32/158663_2.png) [@shimphillip](https://forum.freecodecamp.org/u/shimphillip)\
**Post date:** [March 25, 2019, 8:43pm UTC](https://forum.freecodecamp.org/t/tribute-page-issue-with-text-align-center/267287/6 "2019-03-25T20:43:26Z")

</div>

Good job! it looks pretty good.

You can eventually work on making it responsive as well.

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [January 17, 2021, 8:03pm UTC](https://forum.freecodecamp.org/t/tribute-page-issue-with-text-align-center/267287/7 "2021-01-17T20:03:45Z")

</div>