Skip to content Skip to sidebar Skip to footer

Remove Space Between Paragraph And Unordered List

Text

  • One

Text 2

How do i remove the vertical space between paragraph and the list. To be more

Solution 1:

You can use CSS selectors in a way similar to the following:

p + ul {
    margin-top: -10px;
}

This could be helpful because p + ul means select any <ul> element after a <p> element.

You'll have to adapt this to how much padding or margin you have on your <p> tags generally.

Original answer to original question:

p, ul {
    padding: 0;
    margin: 0;
}

That will take any EXTRA white space away.

p, ul {
    display: inline;
}

That will make all the elements inline instead of blocks. (So, for instance, the <p> won't cause a line break before and after it.)


Solution 2:

One way is using the immediate selector and negative margin. This rule will select a list right after a paragraph, so it's just setting a negative margin-top.

p + ul {  
   margin-top: -XX;
}

Solution 3:

This simple way worked fine for me:

<ul style="margin-top:-30px;">

Solution 4:

p, ul{
     padding:0; 
     margin:0;
}

If that's not what your looking for you'll have to be more specific


Solution 5:

You can (A) change the markup to not use paragraphs

<span>Text</span>
<br>
<ul>
  <li>One</li>
</ul>
<span>Text 2</span>

Or (B) change the css

p{margin:0px;}

Demos here: http://jsfiddle.net/ZnpVu/1


Post a Comment for "Remove Space Between Paragraph And Unordered List"