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

Posted by Denis Zhidkov
Denis Zhidkov
2,660 Points

Why does css doesn't work on mobile devices and works on desktop?

Can anyone tell me why does one of my pages is responsive on desktop and it looks different on mobile?

Page: http://vote.hooters.com.ru/thanks.html

Here is screenshot on desktop - https://yadi.sk/i/AWTJSbNvmQkcd

Here is screenshot on mobile - https://yadi.sk/i/1Znzna8omQkkW

Why does text goes up on mobile?

1 Answer

Jonathan Grieve
MOD
Jonathan Grieve
Treehouse Moderator 91,254 Points
Jonathan Grieve
Jonathan Grieve
Treehouse Moderator 91,254 Points

I notice your website is using a complex grid system using Bootstrap.

I think that's happening is that all your elements are trying to find places to do when you resize your browser. They have to go somewhere. They're positioned relative to a parent element which is typically the body element.

what you could do is try wrapping all your elements in a containing div element rather than the body. This way your elements won't have so much space to move about from mobile to desktop.

Alternatively you could use media queries to create different grid systems based on the width of the browser so your element moves further to the bottom when it's at more of a mobile size.