Looking For An Alternative To Flex

I am using flex to align a text and two buttons inside a div. This is my code This code is working properly on most browser but in some others flex is not supported. Is there any

Solution 1:

You can achieve the same result using lot of techniques in css, i'll show you some examples:

Using Inline-block elementhttps://codepen.io/joaoskr/pen/OaEdJz

Using Float lefthttps://codepen.io/joaoskr/pen/JeZxXX

Using table alignmenthttps://codepen.io/joaoskr/pen/zMaewv

As you can see, you have lots of possibility to achieve the same result without use flex, choose which you think better, hope it can help you !!

Solution 2:

You can use a polyfill for the browsers that don't support flexbox. For example: https://github.com/jonathantneal/flexibility

Modernizr has several options listed here: https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills#flexible-box-layout-spec

That way you can still use flexbox and also support other browsers.

Solution 3:

Most modern browser versions support flex, however you may want to include some browser specific rules for legacy support.

-webkit-flex: for Chrome 21.0+/Safari 6.1+

-ms-flex: for IE10

-moz-flex: for Firefox 18.0+