crop - understanding inline-block divs and its "margin" css property -


i'm trying understand code in order both crop , center image.

i think i've understood of it, i'm still not figuring out why need this:

.img-crop img{     /* removes(sorta) image flow */     padding-left: 100%;     margin: -100% -100%; } 

i think margin: -100% -100% centering image both vertically , horizontally, why placed on left of container (and therefore: why need padding-left: 100%)?

i think figured out how works. here can find example tried write scratch. image has been replaced div, since both displayed inline-block, last 1 convenient changing heights , play it.

let me it's quite useful if don't want use jquery heavily manipulate dom! crop , centering in bunch of css rulesets.


Comments

Popular posts from this blog

java - Run a .jar on Heroku -

java - Jtable duplicate Rows -

validation - How to pass paramaters like unix into windows batch file -