Reduce line-height

HTML & CSS
1

Hi how can I reduce line height from my <h5> and <ul>? The “impact indicators” word theres too much space in between for me I want to reduce it…

1010×338 19.6 KB

<div id="site-map list">
  <div id="box_title"><h2 id="sitemap_title">Sitemap</h2></div>
    <ul class="pages" style="list-style:none;">
      <h4 id="pagehead">Pages</h4>
      <li><a href="/default.aspx">Home</a></li>
      <li><a href="/ABOUTUS.aspx">About Us</a></li>
      <li><a href="/Products.aspx">Products</a>
        <ul class="pages" style="list-style:none;">
           <h5 id="pagehead">Impact Indicators</h5>        
           <li><a href="/ShockLabels.aspx">Shock Indicator Labels</a></li>
          <li><a href="/Protect_A_Pak.aspx">Protect-A-Pak</a></li>
          <li><a href="/Omni_G.aspx">Omni-G</a></li>
        </ul>
      </li>
      <li><a href="/CONTACT2.aspx">Contact Us</a></li> 
    </ul>
2

There is a line-height css element.

You might also want to reduce the margin.

3

This doesn’t answer your question.

Did you follow @RyanReese 's advice and check your HTML in the HTML validator?

When you post HTML, we usually need to see the CSS that affects those tags and classes or ids.

2 Likes
4

but thats to increase line-height no? the line-height synax…

5 
.pages a{
 font-family: "open sans", sans-serif;
 color:black;
 font-size:10pt;
}

.pages a:hover {
  color:red;
  
}

#pagehead{
   font-family: "open sans", sans-serif;
   font-weight:bold;
}

#sitemap_title{
   font-family: "open sans", sans-serif;
   font-weight:bold;
   color:white;
   margin-left:10px; 
}

#box_title{
   background-color:#385285;
   width:974px;
}
6

###Summary
On block level elements, the line-height CSS property specifies the minimal height of line boxes within the element.

You should also validate your HTML as @ronpat suggested. It’s not valid.

7

Do you just want a smaller margin between the header adn the UL? Not line height?

8

RIGHT. :smiley:

9

OK. :smiley:

10

So you now know which property to mess with to reduce the space? Test it out and try to do it yourself.

11

Ok. ill try.

12

im using line-height: 0%; it reduces it a little bit…

13

Perhaps you need to re-read post #7.

14

whoops yeah I want to reduce the margin between the ul and header…

15

Then you need to mess with that property.

Disclaimer: you’ve given me very limited code so I can only assume it’s margin-based. A test page would be perfect so I can properly steer you.

16

duh :laughing: ill use Margin thanks!

17

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.