CODEWITHSUNDEEP
htmlcss
Sophie Jones
Sophie Jones

Reputation: 11

Looking to delete empty space (working with HTML)

I am a complete newb with coding, and I'm running into a bit of trouble with some text on my website. The code I am using is as follows:

<p><div style="font-family:blog_script"><font size="7">Hi, We're <b>The Distance</b><p></p></font></p>
</a> 
</div><p>

I would really appreciate any help with:

  1. The spacing in between each line (I would like for the lines to be slightly further apart)
  2. There is also a lot of empty space below the text creating a large gap between the HTML code and the normal text on the site, I would like to get rid of this.

See our website for a demo link.

I'd really appreciate any tips you can give me.

Thanks so much for your time.

Upvotes: 0

Views: 52

Answers (4)

Tojo Paul Mangaly
Tojo Paul Mangaly

Reputation: 196

<div style="font-family: blog_script; line-height: 1;">
  <font size="7">Hi there, We're 

    <b>The Distance</b>
  </font>
</div>

I have set line-height for the div. Try this. It worked for me.

Upvotes: 1

frnt
frnt

Reputation: 8795

See you could use line-height for reduce spacing. Like one I found on you site. Similarly as below you have to target parent element with different class and id and set his line-height accordingly.

#siteWrapper {
    font-family: "Kameron",Georgia,serif;
    font-weight: 400;
    letter-spacing: 0px;
    font-family: "Open Sans";
    font-size: 16px;
    line-height: 1.5em; /*Line height reduce this and adjust*/
    letter-spacing: .4px;
    font-weight: 300;
    font-style: normal;
    color: rgba(0,0,0,.5);
}

Check this simple example which helps you to understand how line-height and letter-spacing works jsFiddle

Upvotes: 0

Abdullah Ayyash
Abdullah Ayyash

Reputation: 59

You need to make a custom css class to manage any adjustments you need to do to a certain HTML element. 

.more-height {
  line-height: 1;
}

Add the class name to the class="... property of the "we are the distance" like this:

<div style="font-family: blog_script;" class="more-height">

This will make the distance between the lines a bit higher.

You can also inject the style of the div element above with the "line-height" property like this:

<div style="font-family: blog_script; line-height: 1;">

Let me know if this works.

Upvotes: 0

aneesh jose
aneesh jose

Reputation: 381

You need to edit the associated style sheet for this. For a quick fix for problem 1, you can try putting new line between the lines -

Blockquote

"Hi, We're The < br> Distance"

Blockquote

Upvotes: 0

Related Questions