Why is display=grid not working in IE?

Related searches

I am using display = grid in CSS. It's works fine for Chrome & Firefox, but it's not working on IE. Any CSS tricks or any other solution?

Specifying e.g.:

#grid_container {
    display: -ms-grid
    display: grid
    ...
}
<div id="grid_container">
    ...
</div> 

will currently, as of 2017-11-14, work for Internet Explorer and Edge on Windows, as well as other browsers in Windows and other platforms.

The new style display property will take effect for other browsers, and the original Grid element with the vendor prefix from the March 2012 W3 Working Draft will be used by Internet Explorer and Edge browsers in Windows.

This is current as of: 2017-11-14: IE 11.726.15063.0 Update 11.0.48 Edge 40.15063.674.0​ Windows 1703 Build 15063.726.

and tested in: Chrome, Firefox, Safari, and Vivaldi in High Sierra; Chrome, Firefox, and Samsung Cloud (mobile browser) in an Android phone; and Chrome, Firefox, Internet Explorer, and Edge in Windows 10.

I am also still using e.g.:

-ms-grid-column: 2;
-ms-grid-column-span: 1;
-ms-grid-row: 1;
grid-column: 2 / 3;
grid-row: 1;

per prior research, i.e. Rachel Andrew

I realize this is a little old given the pace of things, but I hope it helps someone.

Why is display=grid not working in IE?, You can easily use CSS grid in IE right now without having to give it any sort of Note that Autoprefixer still does not support the shortcut grid property. work properly */ .grid { display: grid; grid-template-columns: 1fr 10px 1fr;� Since the magic snippet doesn’t work in IE, people probably assume that nothing in the snippet is IE-friendly. In reality, the only reason why the code snippet isn’t replicable in IE is because IE doesn’t support the auto-fit keyword and auto-placement. min-content and max-content are both 100% IE-friendly

display: -ms-grid; for a block-level Grid element

display: -ms-inline-grid; for a inline-level Grid element

from https://msdn.microsoft.com/en-us/library/hh673533(v=vs.85).aspx

The basic building block of Grid Layout is the Grid element, which is declared by setting the display property of an element to either -ms-grid (for a block-level Grid element) or -ms-inline-grid (for an inline-level Grid element). (Because of the preliminary status of the Grid Layout draft, this value and all the properties in this section must be used with the Microsoft-specific vendor prefix, "-ms-", to work with Internet Explorer 10 and Windows Store apps using JavaScript in Windows 8.)

CSS Grid Layout not working in IE11 even with prefixes, How to Make CSS Grid Work in IE in 5 Minutes! What you might not know, is that CSS Grid was first supported in IE 10. In this display:grid; Answer 1. Edge and IE11 use an older version of the Grid specification. Chrome, Safari, Firefox and Opera use the current version of the Grid specification. The problem in your code is that you are using properties that don't exist in the older spec. Adding prefixes to them makes no difference.

display: grid doesn't worked for me even in IE11. I replaced it with display: block and it worked in all browsers. Not sure if it will work in all scenarios. There were some alignment issues which I fixed using CSS.

CSS Grid in IE: CSS Grid and the New Autoprefixer, The Grid implementation that is in IE10, IE11 and current Edge is an So work you do to implement grid in IE should work in those versions without and check for display: grid the CSS inside the feature query will not be run� I'm experimenting with css grid and i'm trying to make a simple example, but it does not seem to work on IE11 although i use the appropriate syntax: .grid { background: gold; height: 90v

Supporting CSS Grid in Internet Explorer | by Elad Shechter, Rachel Andrew is not only Editor in Chief of Smashing Magazine, but also a going to support browsers without grid support, it is worth working out what Internet Explorer 9 (or IE 11 and below if only considering the new spec) When you use display: table-cell to create columns, CSS will create what is� Most developers are afraid to start using CSS Grid because of browser support, but CSS grid is fully supported in all main browsers: Chrome, Firefox, Safari, Edge including their mobile versions.

Should I try to use the IE implementation of CSS Grid Layout?, I'm working out of a legacy codebase that uses a combo stylus and styled components. We're trying to move everything to styled components, so I� Issue is gridview paging and sorting not working in EDGE browser. Works fine in IE 11. Postback doesn't get fired on click on page no or sort column header. Nothing happens in EDGE browser. Please advice.

Using CSS Grid: Supporting Browsers Without Grid — Smashing , I've setup a css grid with 3 columns to display our portfolio. I found a working code for Firefox and Internet Explorer and Safari. However on Chrome it doesn't show my grid at all, all the picture

Comments
  • In what version of IE?
  • What's not working?
  • display:grid is only working in IE11
  • Only in IE11 and only an older version of the spec. caniuse.com/#feat=css-grid