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

elements not lining up?

I am having trouble lining some elements up. if one goes to www.theli5t.com on a desktop site the page scales fine, but when i go to my phone, it doesn't look like it should as it does when scaled under 650px, which is where my media query is set. why is this?

1 Answer

Hi Reid Larson

I think you have 2 issues here where you are setting the width in px's and this is causing the page not to scale

they are on

style.css line 245 .container{}

style.css line 320 .large_header{}

just remove these set pixle widths and leave blank or add a percentage based width and it should work

well, i got rid of those and no luck. I even got rid of #nameimg thinking maybe that was dropping them down, still no luck. Now that is sitting down. a little. I don't get why it scale fine one the desktop but the phone it doesn't. hmm

Alright I think your problem may be the media query, your setting it just for the screen width which refers to a desktop. For mobile and tablet devices you need to set the device screen width eg max-device-width

have a look at css tricks media Queries for more info.