CODEWITHSUNDEEP
htmlcss
user3407988
user3407988

Reputation: 131

Decreasing spacing between two lines in HTML

HTML n00b here. I can't paste my actual code because it's from work, but basically I have 

<p>Some text</p>
<p><a href="SomeSite.com">Some more text</a></p>

and I want those lines to be stacked on top of each other while the rest of the lines on the page maintain their normal spacing between each other.

I tried doing 

<p style="padding-bottom: 0px">Some text</p>
<p><a style="padding-top: 0px" href="SomeSite.com">Some more text</a></p>

but that didn't work. It seems like it should work.

Please show me how to do it in proper HTML fashion and explain why my attempt failed.

Upvotes: 4

Views: 34955

Answers (4)

Anurag Suryawanshi
Anurag Suryawanshi

Reputation: 11

You can use the line height: ...;property, like this:

line height: 0.3;

or like this:

line height: 30%

for whatever div or tag you want to apply it to. The original line height will be adapted, based on the number you entered.

Upvotes: 1

OrderAndChaos
OrderAndChaos

Reputation: 3860

Not entirely sure what you mean.

But it sounds like you want a line break, rather than a paragraph.

So...

<p>Sometext<br><a href="#">Some other text</a></p>

The <br> tag is for line breaks.

For more info be sure to checkout w3school: http://www.w3schools.com/html/html_paragraphs.asp It's a great resource for learning web design.

Upvotes: 0

ntgCleaner
ntgCleaner

Reputation: 5985

You will want to do something like this:

<p>Some Text <br /> <a href="">Some more text</a></p>

The <br /> is a line break, so you can have everything in 1 paragraph and the line break will bring the next line under the first. Then, you can use line-height:10px

<p style="line-height:10px;">Some Text <br /> <a href="">Some more texth</a></p>

You can change your px size to whatever.

If you NEED to have two separate paragraphs, you can enclose them in a container and give the line-height to the container.

<div style="line-height:10px">
    <p>line 1</p>
    <p><a>line 2</a></p>
</div>

Upvotes: 8

Sajad Karuthedath
Sajad Karuthedath

Reputation: 15837

use a span tag instead of p tag as p tag will automatically will start in a new line

so you should either use display:inline in css or use a span tag

<span>Some text</span>
<span><a href="SomeSite.com">Some more text</a></span>

DEMO

I just misunderstood your question,so i have the answer below HTML

<p>Some text</p><br/>
<p><a href="SomeSite.com">Some more text</a></p>

CSS:

p{
    display:inline;
}

DEMO

Upvotes: 1

Related Questions