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 CSS Layout Techniques Flexbox Layout Providing Fallbacks with Modernizr

Mayur Pande
PLUS
Mayur Pande
Courses Plus Student 11,711 Points

My file doesn't generate the class "js flexbox".

I downloaded the custom flexbox js file and no class was created. I then just downloaded the whole thing, and when using browser stack on the ios it can be seen that there is no "no-flexbox" Here is a screen dump of what it looks like using brower stack;

browserImage

My site looks fine on android, chrome, new versions of safari, firefox, ie. But does't seem to be working on old ios

2 Answers

Aaron HARPT
Aaron HARPT
19,845 Points

There will not be a no-flexbox class unless you have a browser that does not support flexbox at all like IE9

Mayur Pande
Mayur Pande
Courses Plus Student 11,711 Points

Hi I did try and check it using browser stack and it did not work on on the old safari there are some discrepancies. If you look at my site on safari 6 it can be seen that the footer, about page, and contact page are all affected as they are all using flexbox. But I have downloaded the required js file and created the .no-flexbox clas but it is not working. Not sure what to do

Aaron HARPT
Aaron HARPT
19,845 Points

what are your .no-flexbox styles?

Mayur Pande
Mayur Pande
Courses Plus Student 11,711 Points

Sorry I was making an error. I did not realise that for old safari, firefox and IE. That the prefixes need to be;

  display : -webkit-box;     
  display: -moz-box;         
  display: -ms-flexbox;      
  display: -webkit-flex;     
  display: flex;

It now is working for these browsers. Although I should created .no-flexbox styles for IE 8.