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
chevarn mitchell
Courses Plus Student 627 PointsNeed make image width 100% only the width
I have been trying to make an image on my web page 100% of the browser width and keep it fixed
2 Answers
Paul Mather
3,313 PointsCan you post your current HTML and CSS?
Generally, assigning a width of 100% to an image will only make the image the same width of its container div. You can give an image 100% width with the following CSS...
img { width: 100%; }
If the image isn't taking 100% of the width of the screen it's because it's inside a div that has a restricted width. Take it out of the containing div and you'll get 100% width.
If you don't want the height to change, you must set a height to the value of whatever it is you want, for example...
Img { width: 100%; height: 400px; }
And now, if you want your image to scroll when the screen does, give it a position of fixed like so...
Img { width: 100%; height: 400px; position: fixed; }
chevarn mitchell
Courses Plus Student 627 Pointsthanx alot it all seems simple now