Menu icon Foundation
Rows Acting Weird in IE 11

What's the deal with rows in Internet Explorer? They are squished to the middle of the screen. This happens on all my Foundation-based sites—and even on the Foundation docs site itself. See attached screenshots.

As much as I loathe dealing with IE, I need to fix this so that the rows display as they do in all the other browsers. Any ideas on how to achieve this?

Screen shot 2014 11 04 at 1.23.59 pm

Screen shot 2014 11 04 at 1.27.56 pm

RowsstylesIEInternet Explorercross browserbug

What's the deal with rows in Internet Explorer? They are squished to the middle of the screen. This happens on all my Foundation-based sites—and even on the Foundation docs site itself. See attached screenshots.

As much as I loathe dealing with IE, I need to fix this so that the rows display as they do in all the other browsers. Any ideas on how to achieve this?

Screen shot 2014 11 04 at 1.23.59 pm

Screen shot 2014 11 04 at 1.27.56 pm
Rafi Benkual almost 5 years ago

What size screen are you viewing this on? Could be some browser settings?

We test on IE9+
Looks good in testing http://awesomescreenshot.com/0e93sato0e

In chrome on a thunderbolt display http://awesomescreenshot.com/0153sau5c8

Megan Carroll almost 5 years ago

I am viewing the site on a 15-in retina macbook pro via VMWare Fusion, the resolution says 2280 x 1512.

Megan Carroll almost 5 years ago

I guess that was the issue. I didn't realize that VMWare fusion had such a huge display resolution.

Rafi Benkual almost 5 years ago

You can widen the rows in your project. We typically use

.row {
max-width: 1400px;
}