Bug Tracker

Opened 9 years ago

Closed 9 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:


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.


<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>                


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

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


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 9 years ago by dmethvin

Component: unfiledcss
Resolution: notabug
Status: newclosed

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


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 9 years ago by dmethvin (previous) (diff)
Note: See TracTickets for help on using tickets.