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 How to Make a Website Responsive Web Design and Testing Build a Three Column Layout

I cant get three columns working :(

Im at the part with making three columns, but for some reason it never works?

@media screen and (min-width: 480px){ /Create two columns using id's, then edit in HTML/ /********************************** TWO COLUMN LAYOUT ***********************************/ #primary { width: 50%; float: left; }

#secondary { width: 40%; float: right; }

/********************************** To make three columns 3 (columns) - 5(2.5 margin left/right) = 15% 100% (of page to use) - 15% = 85% (to make three columns) 85/3 = 28.333333 //Do not round off the number to a whole// ***********************************/

/********************************** PAGE: PORTFOLIO ***********************************/

#gallery li { width: 28.3333%; }


My code is above, and it looks similar to my main.css which uses #gallery li so I dont understand why responsive.css wont work on this. Thanks for any help.

1 Answer

Wow ok, I guess I needed to refresh instead of click the eyeball? Sorry to bother!