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 Le Var Range
.a{fill-rule:evenodd;}techdegree
Le Var Range
Front End Web Development Techdegree Student 18,011 Points

media query and display switching madness!

I have three media queries in my css file. One for phone / tablet / and desktop. The first is set to block of the list items . the second is set to inline-block .. this is where I am having such trouble... when i stretch the screen to 798px the list items remain as block level elements instead of inline-block elements. I would like to know where am I going wrong. Thank YoU.

Gianmarco Mazzoran
Gianmarco Mazzoran
22,076 Points

Hi could you post your css code here?

3 Answers

mikes02
PLUS
mikes02
Courses Plus Student 16,968 Points
mikes02
mikes02
Courses Plus Student 16,968 Points

Make sure to provide your CSS, without seeing code it's almost impossible to provide the appropriate solution. However, what I would recommend doing is using min-width media queries to make the adjustments.

For example:

li {
    display: block;
}

@media (min-width: 798px) {
    li {
        display: inline-block;
    }
}
Le Var Range
seal-mask
.a{fill-rule:evenodd;}techdegree
Le Var Range
Front End Web Development Techdegree Student 18,011 Points
Le Var Range
.a{fill-rule:evenodd;}techdegree
Le Var Range
Front End Web Development Techdegree Student 18,011 Points

I have done something very similar to that but does not work. I will provide the code within a few

Le Var Range
seal-mask
.a{fill-rule:evenodd;}techdegree
Le Var Range
Front End Web Development Techdegree Student 18,011 Points
Le Var Range
.a{fill-rule:evenodd;}techdegree
Le Var Range
Front End Web Development Techdegree Student 18,011 Points

I have done something very similar to that but does not work. I will provide the code within a few