Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS

Jiten Mistry
Jiten Mistry
4,698 Points

How do i keep all my elements in the same position when the browser is resize, e,g when i make it smaller?

Also when using CSS what unit do i use so the elements on the page fit all screen sizes?

3 Answers

Hi Jiten,

Thanks for your reply, I understand what you mean now:

There are many ways of styling layout in a responsive way from mobiles right up through to a large desktop. Through the use of media queries you can change the display properties of a element which is probably the most simplistic way for now as i see you are still quite new to css.

Have a look here and mess around with the Display Values from block to inline-block and inline o see the difference!

Hope this helps!

Craig

Hi Jiten,

This would all depend on what your end goal is; you can prevent a website form being scaled to fit the device width in the head element of your code through the meta tag. More info here

In your CSS if your widths and heights are set to % values the element with these values will scale relevant to its parent containers width and height.

Could you explain a little bit more on what you want to achieve by the elements not moving when the browser re sizes ?

Craig

Jiten Mistry
Jiten Mistry
4,698 Points

thank you for that Craig and sure. So elements on the page when the browser is re-sized they do not overlap or cannot be seen fully. Ideally when i resize the browser i would everything to be on display in same order as a full browser but of course will be underneath each other. if that makes sense?