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 Gary Calhoun
Gary Calhoun
10,317 Points

I am trying to make the blog cat responsive

http://codepen.io/nufftalon/pen/NGjrmy

I am not sure why i know @media screen usually would fix this issue but I can't seem to get these blog categories to resize properly when the page is resized it breaks out of the layout

.module-category li a {
    float: left;
    padding: 6px 10px;
    background-color: #898989;
    margin: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    font-size: 14px;
    -webkit-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
    -o-transition: all 200ms ease-in-out;
    transition: all 200ms ease-in-out;
}

@media screen and (max-width:500px) {
  .secondary .module-category li a {

display:block;


  }

}
Julian Aramburu
Julian Aramburu
11,368 Points

Hey Gary! What is the problem? It seems to display nice in my browser!

2 Answers

Gary Calhoun
Gary Calhoun
10,317 Points
Gary Calhoun
Gary Calhoun
10,317 Points

http://codepen.io/nufftalon/pen/NGjrmy I updated the html to reflect my issue better... basically if I have more than 4 of those category list elements it breaks out of the column, if I am on mobile I want it to stay within the column so it should be like two per row on mobile moreless hope that explains it better.

Gary Calhoun
Gary Calhoun
10,317 Points
Gary Calhoun
Gary Calhoun
10,317 Points

Everything is working now thanks.