html - Margins got bugged (elements are buggy) when image inside div is centered horizontally and vertically -


I have 2 pictures below each other, I want them to be horizontally and vertically centered in parent div Go. The problem is that the second element will not fit in the parent div.

This is what I need:

what do i want

And now I have it:

What I have now

Here is the code I am using:

HTML:

  & lt; Div id = "slika" & gt; & Lt; Img src = "images / elementi / EXTRA_SNIZENO.png" width = "auto" height = "15" alt = "EXTRA" & gt; & Lt; Br> & Lt; Div class = "img-wrapper" & gt; & Lt; Img src = "r / images / ideafissa_1.png" width = "auto" height = "auto" alt = "papirnatirucnik.jpg" & gt; & Lt; / Div & gt; & Lt; / Div & gt;   

css

  #slika {border: solid 2px; Display: Table; Swim left; Height: 126px; Width: 111px; Text align: center; Vertical-row: middle; } .img-wrapper {display: table-cell; Vertical-row: middle; } IMG {max-width: 100%; }   

jsFiddle:

complete; To remove this from the document flow, there is a need to set the container # silka to status: relative to ensure that it has the image instead of the viewport situated at.

  #slika {status: relative; Border: Solid 2px; Display: Table; Swim left; Height: 126px; Width: 111px; Text align: center; Vertical-row: middle; } .img-wrapper {display: table-cell; Vertical-row: middle; } .topImage {status: absolute; Left: 0; Top: 0; } IMG {max-width: 100%; }   
  & lt; Div id = "slika" & gt; & Lt; Img src = "http://tommyvirtualnikatalog.com.hr/images/elementi/EXTRA_SNIZENO.png" width = "auto" height = "15" alt = "extra" square = "top image" /> & Lt; Br> & Lt; Div class = "img-wrapper" & gt; & Lt; Img src = "http://tommyvirtualnikatalog.com.hr/images/akcija/neprehrana/1796_muska-carapa-ideafissa_1.png" width = "auto" height = "auto" alt = "papirnatirucnik.jpg" /> & Lt; / Div & gt; & Lt; / Div & gt;      

JS Friedal:

Comments

Popular posts from this blog

php - PDO bindParam() fatal error -

logging - How can I log both the Request.InputStream and Response.OutputStream traffic in my ASP.NET MVC3 Application for specific Actions? -

java - Why my included JSP file won't get processed correctly? -