CODEWITHSUNDEEP
androidhtmlcsssafariflexbox
user2752929
user2752929

Reputation: 311

Flex Box in Android and Safari browsers

I have a wonderful problem, to don’t say otherwise.

Look this site (he is in portuguese, but the code are in english).

http://filmseasy.com/nepes/ (sorry about domain, but I needed somewhere for host)

I’m finalizing the menu and all its responsive ways. But, in chrome, or firefox and other browsers except the safari, on PC, all website look great, and exactly the way I wanted.

But in android native browsers, I’m having serious problems with the flex box.

In my code, on tablet-style.css, you will see that I put just the flex command in .flex css class, but I say that has put the vendors prefix, and still the same thing happens, =[. I left so that you may see more clearly.

Put in this website, http://mattkersley.com/responsive/, and see how works and how resolutions should appear.

And please, look on Android device, and see the difference in view.

Thanks for all.

Upvotes: 0

Views: 4248

Answers (1)

Jason
Jason

Reputation: 519

On your .logo class you need to give it a -webkit-box-flex property to make it grow, and the element must be display: block

display: block;
-webkit-box-flex: 1;

Safari for Windows PCs is quite old, so it uses the old Flexbox spec, as does iOS 6 and most Androids.

Upvotes: 3

Related Questions