Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Treehouse Club - MASH MASH - CSS CSS in Dev Tools

Posted by Tyson Dover
Tyson Dover
3,862 Points

my own logo wont show on the web page

I am trying to add my own logo to this project but for the life of me I can't tell what I am doing wrong.

<h1 class="logo"><img src="img/wwe_belt.jpeg" /></h1>

the image does not show when I refresh the page but I know its probably me because I can change the file name back to the mash and it works. TIA Cheers!

1 Answer

Steven Parker
Steven Parker
231,248 Points
Steven Parker
Steven Parker
231,248 Points

Some things you might check:

  • the file uploaded ok
  • the file name is correct ("wwe_belt.jpeg")
  • the file is located in a sub-directory named "img"

If those all seem good, you might want to make a snapshot of your workspace and provide the link for further analysis.

Tyson Dover
Tyson Dover
3,862 Points

it was not in the img sub directory, thanks for the help and the tip about snapshot for next time. Cheers!

Tyson Dover
Tyson Dover
3,862 Points

can you help me adjust the size of the image? also how do i make it centre? check out my snapshot https://w.trhou.se/8jzlg8yobg

Steven Parker
Steven Parker
231,248 Points
Steven Parker
Steven Parker
231,248 Points

You can easily adjust the size with some additional CSS:

.logo img { width: 50%; }

You could also just add the width property to the existing ".logo img" rule. If you want a fixed size instead of a relative one you can use a number of pixels (px) instead of a percentage.

Centering should already occur due to the auto margins set by the existing CSS.