- It's finally time to clean up those images…that have been giving us so many problems…when we're previewing our website.…If you remember what our website looks like…when we go to View menu and choose Preview In Safari,…we get something that looks…not so great.…So how do we then, get around that?…Well, it's actually pretty simple.…Let's go back into Coda for a second…and inside of Coda, what I'm going to do…is I'm going to go down,…just to where the images are,…and you're going to see there's nothing really…out of the ordinary here.…They're just direct links to those images.…

The reason why the images are showing up so poorly…is because they are so large…and they're going outside of their containers.…Well in order to put them in their containers…we have to go into the CSS.…And inside of the CSS,…we'll scroll down to the section marked Images & Media.…And the first thing we're going to do here…is we're just going to add in on line 41…this little piece of CSS.…img, for image,…and we're going to give it a max-width property.…

Resume Transcript Auto-Scroll

Author

Released

6/22/2015

A great portfolio can make the difference between landing the job and getting passed over. This quick and fun project-based course will show you how to build a responsive portfolio site from start to finish. Staff author Justin Seeley shows how to plan the website in Photoshop and convert the plan into a single-page site. The backbone driving the portfolio will be Skeleton, an intuitive CSS framework that you'll learn how to use for your own projects. Along the way, you'll find out how to work with web fonts like Google fonts and icon fonts, how to start inserting content into containers, and how to style the look of headers, images, typography, and even social media buttons with some simple custom CSS. Add on a responsive lightbox effect and some media queries to make sure your site is ready for mobile, and you'll have a complete, high-quality platform for showcasing your work.