html - Safari: table-layout: fixed in absolutely positioned element doesn't stretch parent -


i have div display: table; table-layout: fixed; width: 100% child of div position: absolute. on chrome, ie, , firefox, child div table-layout: fixed makes parent div expand 100%, in safari (6.0.4, os x 10.8.3) doesn't happen. here's picture

safari rendering problem

and jsbin http://jsbin.com/oqupah/6/edit (make sure open output in new window). markup this:

<div style="position:absolute;border: 1px solid black">   <div style="display:table;table-layout:fixed;width:100%;border:1px solid red;">     <div style="display:table-cell;border:1px solid green">a</div>   </div> </div> 

this html 5 , xhtml 1.0 doctypes. noticed if remove doctype in safari, behave other browsers, removing doctype not option.

in practice, had code when implementing absolutely positioned popup, content of popup div display: table; table-layout: fixed; width: 100%. want popup stretch 100% can provide max-width , if window resized, popup shrink accordingly.

so i'm guessing bug in safari? behavior on mobile safari same. there can add make behave other browsers?

fix add right: 0 absolutely positioned div

... wasted time on this.


Comments

Popular posts from this blog

jquery - How can I dynamically add a browser tab? -

node.js - Getting the socket id,user id pair of a logged in user(s) -

keyboard - C++ GetAsyncKeyState alternative -