Good afternoon, dear experts. I ask for help, who knows, after switching to HTML5, there was an indentation below all the pictures of approximately 4 pixels, in HTML4 there was no such problem. Here is my simplified code: https://jsfiddle.net/j5k9rh30/2/

<div style="display:table; border:solid 1px; height:100px;"> <div style="display:table-cell; vertical-align:bottom;"> <img src="https://oc0.ru/template/bmp/logo/nv_202x34.png" style="border:solid 1px;"> </div> </div>

Specially made the alignment on the bottom edge, so that you can see the gap. Indent only from the bottom nowhere else. I'm not a newbie much scolding.

    2 answers 2

    Specify the line-height:0 from the nested div line-height:0

    • Thanks, it helped - Igor Salamov
    • and then specify border-top: solid 1px;" instead of border: solid 1px;" , and then it looks poor - Abs3akt

    Try this

     <div style="display:table; border:solid 1px; height:100px;"> <div> <img src="https://oc0.ru/template/bmp/logo/nv_202x34.png" style="vertical-align: bottom;margin-top: 65px;border-top: solid 1px;"> </div> </div>

    Problem from vertical-align: bottom;