How to adjust spaces between lines

2 Views

In my site , there is a big space between each line . This is the css portions of that section. I have tried line-height but it is not working there. 

#site-generator a {
color: #5D45A3;
font-weight: normal;
text-decoration: none;

}

Read More

You can check the site here . Check the footer area ‘Latest News’. I would like to reduce the space between each post names.

Post Views: 2

Related posts

Leave a Reply

5 comments

  1. Seems like you need to remove the height property from here:

    .widget-area ul li {
  font-size: 11px;
  /* height: 23px; */ /* <- remove */
}

    and here:

    .widget ul li {
  font-size: 11px;
  /* height: 16px; */ /* <- remove */
}

    Or set these heights as auto

  2. Simply adapt the height value in your stylesheet to your needs.
    Line-height should work to adjust the space between two lines.

    .widget-area ul li {
    font-size: 11px;
    height: 16px; /* example */
    line-height: 0.8em;
}

  3. Press F12 in your favourite browser to access the developer console (I believe this works in the latest version of IE, FF and Chrome). Inspect the a element that has such an abnormal height. This shows that:

    You are setting a line-height of 2.2em on #site-generator in style.css. If that style is deleted, it uses a line-height of 1.625 for body, input, textarea in style.css.

    The distance between two li‘s in that menu is defined by .widget-area ul li and is 23px. If that style is deleted, the css for .widget ul li is used instead with a height of 16px.

    You’ll need to alter the first one to put the text of one link closer together. You’ll need to alter the second one to put the different links closer together.