Spacing between html paragraphs

Asked

Viewed 32,773 times

4

At first I want to say that I am beginner in the area, I started to attend recently Information system and my question is to perform a work worth note.

by using the tag:

<p>primeiro parágrafo</p>
(este espaço precisa ser reduzido)
<p>segundo parágrafo</p>

However my teacher has not started the content of CSS and I will not see it before the delivery date of the work, if there is no solution without the use of CSS I ask you to explain how to do, because I really still have no idea how to introduce CSS in html code.

  • Have you tried researching something on the subject?

  • Yes, I searched, but I did not find anything in html simplified, but I already solved with one of the tips of a colleague of the site.

2 answers

8


If you’re limited to not using CSS, what you could do is use a single paragraph and separate with a simple line break.

Thus:

<p>primeiro parágrafo<br>segundo parágrafo</p>

Upshot:

first paragraph
second paragraph


On the other hand, using CSS, we have the following: Every browser adds its own style rules to the common elements. Google Chrome, for example, sets these rules:

p {
  -webkit-margin-before: 1em;
  -webkit-margin-after: 1em;
}

Already Firefox does so:

p {
  margin-top: 16px;
  margin-bottom: 16px;
}

Visually the effect is the same: add a margin to the element <p>. The simplest and best portable way between different browsers is to use the normalize.css. It contains rules to undo the default rules of all browsers and make the style unique. So use:

<link rel="stylesheet" href="http://necolas.github.io/normalize.css/3.0.1/normalize.css">

Alternatively you can reset all forms of element margin with this rule:

<style>
  p {
    margin: 0;
  }
</style>

Or so applied:

<p style="margin: 0;">primeiro parágrafo</p>
<p style="margin: 0;">segundo parágrafo</p>
  • 1

    William, I’m not limited to using CSS, but I don’t think as an academic it’s interesting that I use a code that I’m not able to understand, because it doesn’t help that I get an A on the job and fail because I don’t know what’s on the test, so whenever I use something new in my work I try to know exactly what is happening, if you can explain how to do it in CSS.

  • @Adrian, I changed with a little more information. It’s clear like this?

  • Great, the first options you explained I didn’t understand, because the only thing I know about CSS so far is that there are 3 ways to use, but I’ll test the last one right now to see. Thank you.

  • It worked perfectly for what I wanted, it’s earned my respect. -

1

p {
    text-indent: 2em;
    text-align: justify;
}
  • You’re a little late, just a little.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.