There is a default row gap when I am adding 2-3 elements inside a div. I tried to add negative values but it seems not working, but by adding positive values in row gap it’s increasing the gap properly. How can I remove that default gap or reduce it?
Hello,
Can you give me your website and screenshot of where you are seeing default gap?
Here as you can see inside the div one heading and paragraph are there and the spacing options are on default only. But there is a gap between the two elements.
But I found a solution now, once I set the margin for both elements (heading & paragraph) zero, for Heading element I set bottom margin 0px and for paragraph element I set the top margin to 0px - then it worked.no more gap.
But I am not sure why that happened. it was zero by default, still I had to set it to 0 manually then it worked.
Headings and paragraphs have default margin provided by browsers default (HTML). Our designer doesn’t read that as of now, thats why when you start a project from scratch, you get predefined styles and most of the styles we predefine is to fix issues like this from happening.
But other day you run a function that Dejan gave you to delete all of the predefined styles, and now in designer you don’t see values provided by HTML default.
In future we will cover this HTML defaults as well, but for now, you need to understand them if you delete all pre-defined styles that we provided. You can use inspect element to debug when you are seeing invisible margins. Most of the tags in HTML are coming with pre-defined margins.
1 Like
Thank you so much for such an explanation. I appreciate it.
I knew about Default Browser Style (HTML) but I totally forgot that I ran that function and deleted all the predefined styles by Divhunt, now I understand why it’s happening.
Thanks.