Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Remove spacing between <p>

Tags:

html

css

I want to remove the spaces between paragraphs so all my text doesn't have any kind of space between each other, but I don't know which proprety I should use.

I am aware of line-height, but tried messing around with different values and couldn't find the correct one.

Example code:

<style>
p
{
  margin:0;
  padding:0;
  font-size:60px;
}
div
{
  margin:0;
  padding:0;
  background-color:red;
}
</style>
<div>
  <p>test</p>
  <p>test</p>
</div>

Image of code (I want to remove the space between "test" and "test"):

example

like image 383
Pacha Avatar asked Aug 22 '13 23:08

Pacha


People also ask

How do I reduce the space between two p tags?

Setting padding to 0px of the parent paragraph tag will remove the space between parent and child paragraphs if one is inside of another. But If padding of parent is already zero then and still there is space then setting margin to zero of children paragraph tag will remove the space.

How do I remove the line of text between paragraphs?

Set your cursor to the location of the paragraph spacing. Click on the Line and Paragraph Spacing icon in the Home Ribbon. Select "Remove Extra Space" to remove the extra space. This has to be done in each document unless you adjust your default settings.

How do I remove spaces between elements in a list?

The spacing between list items in an orderedlist or itemizedlist element can be minimized by the document author by adding a spacing="compact" attribute to the list element. In HTML output, the list will get a compact="compact" attribute on the list start tag to reduce spacing in the browser.


1 Answers

For first <p> set: margin-bottom:0; and for second <p> set: margin : 0; padding-top:0; simultaneously. It shoud be like:

<p style="margin-bottom:0;">
    test
</p>
<p style="margin : 0; padding-top:0;">
    test
</p>
like image 143
Kaaveh Mohamedi Avatar answered Oct 12 '22 17:10

Kaaveh Mohamedi