Tyler Cipriani Creative Commons Attribution-ShareAlike License Copyright © 2017 Tyler Cipriani https://tylercipriani.com/blog/2012/08/01/display-inline-block-extra-margin/ Tyler Cipriani ikiwiki 2018-06-13T19:34:11Z https://tylercipriani.com/blog/2012/08/01/display-inline-block-extra-margin/comment_1_1f7f1cdbfd3fce90e72c6453ee617f08/ bestdenis2008 2018-06-13T19:34:11Z 2013-11-11T06:39:14Z <blockquote> <p>Second, directly address the space by setting a negative right margin or negative</p> </blockquote> <p>It’s a font-dependent solution, isn’t it?</p> https://tylercipriani.com/blog/2012/08/01/display-inline-block-extra-margin/comment_2_cad18998d316750ce8863b50acac3fc5/ thcipriani 2018-06-13T19:34:11Z 2013-11-11T06:50:42Z <p>Yezzur, that solution will depend on the font-size of the parent container. An easier solution might be to just set font-size: 0; on the parent container.</p> <p>The more I play with inline-block, the more I like the comment based solution.</p> <p>You’ll see more solutions in that CSS Tricks article I have linked up.</p> https://tylercipriani.com/blog/2012/08/01/display-inline-block-extra-margin/comment_3_888e4deeb0cb19e5a356b5211dafad3f/ guest 2018-06-13T19:34:11Z 2014-01-24T14:29:22Z or even better, set font-size: 0px on the parent div https://tylercipriani.com/blog/2012/08/01/display-inline-block-extra-margin/comment_4_76ca8273799334281d238c9056e25315/ aayix 2018-06-13T19:34:11Z 2014-04-24T00:45:16Z <p>Yes Guest, font size 0px is required if you want to display the inline-block elements aligned to center. if u have text in the inner elements u’ll need to set the font size for those back again</p> https://tylercipriani.com/blog/2012/08/01/display-inline-block-extra-margin/comment_5_731bb409539a922da91d93dc3b169f44/ foo 2018-06-13T19:34:11Z 2015-01-06T15:32:35Z <p>Two alternatives:</p> <ol type="1"> <li><p>set font-size: 0 on the immediate parent and redefine the font-size of the affected (inline-block) children</p></li> <li><p>just use float: left. display: block is redundant (as it’s inferred from floating)</p></li> </ol>