12

How can I remove spaces between paragraphs in HTML?

<p class="first">This is a small demo</p> <p class="second">This is second demo</p>
Improve this question

8 Answers 8

Reset to default
23

You can use margin: 0; to remove the spaces.

p { margin: 0; }

If this still don't work, try making it !important

p { margin: 0 !important; }

Check this http://jsfiddle.net/zg7fP/1/

Improve this answer
Sign up to request clarification or add additional context in comments.

5 Comments

You can check the demo.
Can u try p { margin: 0 !important; }
Thanks, it did work for me. Is there any specific reason why it didn't without !important
Yes might be some other css file being used and they tend to override your styling. Updating the answer.
Detail about the !important tag : impressivewebs.com/…
4

Try setting margin-bottom: 0 on the top paragraph and margin-top: 0 to the bottom paragraph

or you can use a div instead of the paragraph

Improve this answer

3 Comments

No its not working. And aslo i can't change the html code, its generating automatically.
Is there another CSS file/property that may be overriding your declaration? This does work pretty well in JSfiddle.
Yes some couple of css were there, but had never such idea about css overiding. Thanks for ur help
1

You can set the default margin to zero with CSS:

p { margin: 0px; }
Improve this answer

Comments

1

Try to use line-height: 100%; or other percentage you think it feets well on your HTML.

Improve this answer

Comments

1

You should use p {margin: 0 auto;}

In case you want to add indentation (recommended if you remove spaces between paragraphs) a good technique is:

p + p {text-indent: 1.25em;}
Improve this answer

Comments

1

In case you are using bootstrap this is the solution: the class m-0

<p class="m-0">text</p>
Improve this answer

Comments

0

put both inside a single set of p and seperate with br

Improve this answer

Comments

0

There are a range of "m-x" classes you can add to paragraph elements where x (0+) represent integers driving increasing space between paragraphs:

For example, this will have no space between the paragraphs:

<p class="m-0">hello world</p> <p class="m-0">hello world</p>

For example, this will have a bit more:

<p class="m-1">hello world</p> <p class="m-1">hello world</p>

For example, this will have yet more:

<p class="m-2">hello world</p> <p class="m-2">hello world</p>

And so on...

Improve this answer

Comments