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

CSS

John Levy
John Levy
1,451 Points

Placing images on a page

Hello I have already asked a similar question but I am still having trouble. Can someone give me an example of how to lay out the HTML code and CSS code to insert an image anywhere on a page. Right now I just seem to be able to insert the image at the top of the page pushing the rest of the text down or place the image at the bottom of the page but I cannot seem to place it anywhere on the page. Please can someone give me a sample code and how I can edit it to move it around the page. Thanks in advance

3 Answers

Idan Melamed
Idan Melamed
16,285 Points

Hi again John, There isn't a simple answer to that question.

One of the reason is that the view is always changing. Your website can be viewed on a 1920*1080 wide screen personal computer, or a 360*640 Galaxy S5 mobile device and anywhere in between.

Imagine if you were trying to print an ad... Your question is a bit like asking: How can I place a picture on this ad that will look good on fliers, tv commercials, movie screens billboards, etc...?

Did you try taking one of the "How to build a website" courses?

John Levy
John Levy
1,451 Points

Hello , yes I completed those courses but still having issues. I understand how it will look different on each device which is where the responsive design comes into play. I just dont understand how I can only place the image a few inches below the text. I have attached the HTML5 code and CSS code below. I just cant make the image any close to the text as it already which is whats giving me problems. Looking at my code am I at least in the right direction? Thanks HTML 5 <img src="beginnerimage.jpg" alt=""> </div> CSS img { max-width: 50%; margin:0px; margin-top: 20px; }

Idan Melamed
Idan Melamed
16,285 Points

Not sure I understand, you want make make the image closer to the text above it?