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 trialJack Fitzgibbon
7,607 PointsMedia Queries, need help
How can I use Media queries or anything else to colapse the two columns into one when on a mobile device, Like and iPhone.
Below is the CodePen:
Thank you
3 Answers
Kevin Korte
28,148 PointsA basic media query like so would work
@media screen and (max-width: 800px) {
.column {
width: 100%;
}
}
Kevin Lozandier
Courses Plus Student 53,747 PointsHii, Jack:
Mr. Korte's has in fact provided you a basic media query for you to be able to accomplish what you wanted for that particular pen.
However, your overall approach to have two columns for text is questionable. You should use CSS3 columns to achieve such an effect that's far more scalable.
Jack Fitzgibbon
7,607 PointsThank you, I will take that in mind in future projects
Jack Fitzgibbon
7,607 PointsRob Allessi Please can you delete this post.
Jack Fitzgibbon
7,607 PointsJack Fitzgibbon
7,607 PointsThank you Kevin! :)