Remove Spacing Between Inline-Block Elements

By August 17, 2017 Css, Html No Comments

Remove Whitespace Between Inline-Block Elements

 The inline-block is very useful CSS property to make block level element to inline-block element.  The  inline-block value is incredibly useful when we want to control margin, padding on “inline” elements without the applying them to block and float.

Only the One problem that arrases when you apply  inline-block is that whitespace in HTML  elements. Here i am showing some ways to Remove Spacing Between Inline-Block Elements.

1: Set font-size: 0px; on Parent Element

This is the bet way to of removing white space between elements. set   font-size of  0px on the parent to the inline block elements.

HTML:

CSS:

2: No Space Between HTML Elements

Remove all extra blank space from HTML will solve you issue.

3: Applying Negative Margin

 

Applying negative merging is an another solution, but i don’t recommend you to use this method, because in this case you have to manage margin according to parent.   negative 4px of margin may need to be adjusted based on font size of parent.

 

 

 

 


About Vijay Dhanvai

A passionate blogger by heart and mind, I have been working in this field for 7 years now. A WordPress Professional, web developer and designer who intends to guide his readers about Web Design, WordPress, Blogging, Web Development, and more.

Leave a Reply