Flexbox bug in IE 10-11



Flex child’s width (p element) is exceeding parent’s width.

Add a css rule for child:

.child {

flex: 1 0 auto;



.child {

flex: 1 0;


Screenshot 2016-08-27 14.56.27


Centering a div inside another div horizontally and vertically

I had to set outer div height explicitly to center the inner div vertically (I set only min-height at first). And to center it horizontally, I had to remove bootstrap’s container class on inner div which contained margin-left: auto, margin-right: auto, these were causing problems in IE.


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s