css - How do I get IE < 10 to apply negative margins? -


i have list of items, want present in grid. keep flexible, i'd prefer have elements float inside container , control width percentage. e.g.:

<div style="overflow:hidden">   <div style="float:left ; width:25%">element 1</div>   <div style="float:left ; width:25%">element 2</div>   <div style="float:left ; width:25%">element 3</div>   <div style="float:left ; width:25%">element 4</div>   <!-- etc. --> </div> 

now, have gutter between these cells. again, simple enough - apply margin or padding cells. however, gives me gutter on edges of container, not want.

to around this, have created 2 containers within each other, inner container gets negative margin equal padding of cells. works in modern browsers, fails in ie 9 , older. don't care ie 7 , backwards, ie 8 + 9 still have big market share ignore.

so question is: why ie 8 + 9 not give me negative horizontal margin in following fiddle (note does give vertical negative margin - doesn't same horizontally). , of course, can fix this?

http://jsfiddle.net/pd4vd/1/

try put code on head of page:

<meta http-equiv="x-ua-compatible" content="ie=edge" /> 

Comments

Popular posts from this blog

c++ - Creating new partition disk winapi -

Android Prevent Bluetooth Pairing Dialog -

VBA function to include CDATA -