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
Gordon Akinpelu
7,331 PointsWhy am I unable to have the sections "stack" as I decrease the width of my browser window?
I also am unable to decrease the width of the browser window past a certain point. My code is below. Thanks!
contact.html code: <section id="primary"> <h3> General Information</h3> <p>Not looking for new stuff, as I am new to this. Available to write, and do whateva. </p> <p>Please only use phone contact for urgent inquiries. Facebookand email are cool </p> </section> <section id="secondary"> <h3>Contact details</h3> <ul class="contact-info"> <li class="phone"><a href="tel:555-1234">555-1234</a></li> <li class="mail"><a href="mailto:gordon@gordo.com">gordon@gordo.com</a></li>
</ul>
</section>
responsive.css code:
<section id="primary"> <h3> General Information</h3> <p>Not looking for new stuff, as I am new to this. Available to write, and do whateva. </p> <p>Please only use phone contact for urgent inquiries. Facebookand email are cool </p> </section> <section id="secondary"> <h3>Contact details</h3> <ul class="contact-info"> <li class="phone"><a href="tel:555-1234">555-1234</a></li> <li class="mail"><a href="mailto:gordon@gordo.com">gordon@gordo.com</a></li>
</ul>
</section>
2 Answers
Dean Kennedy
4,491 PointsWhere is the CSS for this file. I would assume you have a media query to handle sizing?
Dean Kennedy
4,491 PointsChange your secondary width to 50%
Gordon Akinpelu
7,331 PointsGordon Akinpelu
7,331 PointsMy apologies; I thought I had pasted it in. Here is the media query...
```@media screen and (min-width: 480px) {
/************************ Two column layout *************************/
primary {
}
secondary {
width: 40%; float: right; }
}```