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 Styling Web Pages and Navigation Style the Portfolio

What happens if there are more than 2 columns? Or does the float feature only allow 2 columns by nature?

gallery li {

float: left; width: 45%; margin: 2.5%; background-color: #f5f5f5; color: #bdc3c7; }

3 Answers

Kevin Korte
Kevin Korte
28,149 Points

As mentioned, you can float as many elements as you want. In this example, the width and margins equal 50%, which two equals 100%.

You could float 100 elements with a width of 1%, it still would equal 100% of the width of the floated elements container.

Peter Smith
Peter Smith
12,347 Points

You can definitely have more than two columns! (In fact, if I remember right later in the lessons Nick takes you through how to make three).

The amount of columns is being determined by

width: 45%;  
margin: 2.5%;

Modify those percentages and see what happens (i.e. width 25%)

Stephen Bolton
seal-mask
.a{fill-rule:evenodd;}techdegree
Stephen Bolton
Front End Web Development Techdegree Student 7,933 Points

You can have as many objects floating as there is space. After that if you keep floating objects they go down to the next line. You can think of having the screen at 100% width once your elements + Padding + border + margin add up to 100% then a new line is created. So if you have really small content you could create a 10 column website (I don't think that would be advisable though).