Bug Tracker

Opened 5 years ago

Closed 5 years ago

#14819 closed bug (notabug)

IE10/IE11 not reporting padding with percentage on table-cell

Reported by: epascarello Owned by:
Priority: undecided Milestone: None
Component: css Version: 1.11.0
Keywords: Cc:
Blocked by: Blocking:

Description

See this bug in 1.10.2 and 1.11.0

There looks to be a bug with IE10/IE11 with table-cell layout with paddings that are percentages.

Chrome and Firefox return a pixel value while IE10/IE11 return 0px.

HTML:

<div class="pure-g-r" data-XXX="" >
    <div id="test" class="pure-u-1-2" style="padding: 30px 0px 30px 8.33%; cursor: default;" data-YYY="">
          <div data-ZZZ="" >
              <div class="actionsOuter" style=""></div>
              <div class="content" style="">XXXXXX</div>                
          </div>
      </div>
  </div>

CSS:

.pure-g-r {
  display: table-row;
}

.pure-u-1-2 {
  display: table-cell;
}

JavaScript:

var elem = $("#test");
var dElem = document.getElementById("test");

console.log("padding: ", elem.css("padding"), " - ", dElem.style.padding);
console.log("padding-left: ", elem.css("padding-left"), " - ", dElem.style["padding-left"]);
console.log("padding-right: ", elem.css("padding-right"), " - ", dElem.style["padding-right"]);
console.log("padding-top: ", elem.css("padding-top"), " - ", dElem.style["padding-top"]);
console.log("padding-bottom: ", elem.css("padding-bottom"), " - ", dElem.style["padding-bottom"]);

JSFiddle: http://jsfiddle.net/d796Y/2/

Change History (1)

comment:1 Changed 5 years ago by dmethvin

Component: unfiledcss
Resolution: notabug
Status: newclosed

Yes, this does look like an IE issue and independent of jQuery.

http://jsfiddle.net/dmethvin/d796Y/4/

Is this from real code? HTML like this seems like "they told me not to use tables for layout so I use the display: table* CSS instead."

We can report this to Microsoft but it's too much of an edge case to fix in jQuery, even assuming we could.

Last edited 5 years ago by dmethvin (previous) (diff)
Note: See TracTickets for help on using tickets.