flex-native v1.2.0

flex-native

English | 简体中文

🔗 Content list

• Background

• Environment Support

• Installation

• Usage

• Contributor

Background

• Because most of the previously written projects use flex layout, and when they arrive at a new company, they start to make IE9 compatible, while flex layout only supports ie10 +, so it's not so convenient to implement a middle layout in IE9. Although it can also be implemented with other layouts, it's not so skilled, and the development efficiency is reduced

• I found a lot of libraries on the Internet about using flex layout in IE9, but almost all of them were not ideal, so I wanted to realize a library supporting flex box layout by myself

🖥 Environment Support

• Modern browser and IE9+

Since the transform attribute is used to calculate the location, any browser that supports the transform attribute supports it

📦 Installation

npm install flex-native

🔨 Usage

• Use in normal HTML

<script src='https://unpkg.com/flex-native@latest'>;

• Use in module

import('flex-native');

add a -js-display: flex declaration before any display: flex declarations in your CSS, or use PostCSS Flexibility to automate this during your build process. like this;

• css .wrapper{
  -js-display:flex; display:flex; align-items:center; justify-content:center; }
• inline <div style='display:flex;align-items:center' />

Generally speaking, it's no different from writing CSS

🤝 Contributor

@robertpanvip @1844877065