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 CSS Layout Basics Page Layout with the Float Property Clearing and Containing Floats

Siddharth Pande
Siddharth Pande
9,046 Points
Posted by Siddharth Pande
Siddharth Pande
9,046 Points

using floats and clearfix

instead of using clearfix to ajust the header to its proper height why can we use position: fixed?

2 Answers

Jacob Jackson
seal-mask
.a{fill-rule:evenodd;}techdegree
Jacob Jackson
UX Design Techdegree Student 7,833 Points
Jacob Jackson
.a{fill-rule:evenodd;}techdegree
Jacob Jackson
UX Design Techdegree Student 7,833 Points

Oh, I misunderstood.

The answer is that technically you could. But for the same reason that the video suggests not giving a fixed height, I would suggest against a fixed position. When you use an option like this in this situation, you could get away with it, but you limit the flexibility for your page.

You should always code with flexibility in mind so you can easily make changes in the future without having to force anything into position. A little extra work up front saves you a lot of time down the road.

Siddharth Pande
Siddharth Pande
9,046 Points
Siddharth Pande
Siddharth Pande
9,046 Points

Thanks again, you cleared my doubt.

Jacob Jackson
seal-mask
.a{fill-rule:evenodd;}techdegree
Jacob Jackson
UX Design Techdegree Student 7,833 Points
Jacob Jackson
.a{fill-rule:evenodd;}techdegree
Jacob Jackson
UX Design Techdegree Student 7,833 Points

Hey Siddharth!

The "fixed" position will actually "fix" the header to a specific place on your screen, relative the viewport itself. From there it will not move.

Think of nav bars that always remain at the top of the page while you're scrolling for example.

The give a great explanation and a viewable example at w3schools here:

https://www.w3schools.com/Css/css_positioning.asp

Hope this helps! -Jake

Siddharth Pande
Siddharth Pande
9,046 Points
Siddharth Pande
Siddharth Pande
9,046 Points

Thank you for answering but I wanted to know that instead of using clearfix why dont we use position: fixed to adjust the collapsed height.