WordPress.org

Forums

[resolved] Trouble adding space between sidebar items (6 posts)

  1. kathysena
    Member
    Posted 5 years ago #

    Hi folks! I'm new here and new to WordPress.org, having moved my blog over from Typepad (with the help of a designer). Blog is http://www.parenttalktoday.com.

    We are trying to figure out how to add space between sidebar items. My designer suggested adding </br> between items, but it doesn't do anything.

    Also wondering if we can add space between the sidebar headings (ex: Love These Bloggers... You Will Too) and the content right below the heading. It's all crammed together.

    Thanks for helping this newbie!

  2. blogatorul
    Member
    Posted 5 years ago #

    try using p>&nbsp</p or simply p></p / use < and > in front of p and after.

  3. kathysena
    Member
    Posted 5 years ago #

    Thx for the quick reply! I added p>&nbsp</p and it did give me the space I wanted, but now in that space you can see p> on the blog itself. You can see it here: http://www.parenttalktoday.com.

  4. alism
    Member
    Posted 5 years ago #

    <br /> moves text down a single line.
    <p>Some text</p> is for paragraphs.
    &nbsp; is for spaces.

    So you're really wanting to use a combination of the last two:
    <p>&nbsp;</p>

  5. kathysena
    Member
    Posted 5 years ago #

    It worked! I'm putting that into my cheat sheet right now. THANKS to both of you.

    They say code is poetry. That's not quite the word I'd use! ;)

  6. syncbox
    Member
    Posted 5 years ago #

    Better to use CSS to change a property like margin, padding or line-height for the list item in the sidebar... The "heading" of a list of pages, for example, is the h2 element (assuming the default here, you can control this with the title_li param for wp_list_pages(); )INSIDE an <li> tag in an unordered list
    <ul> which you CAN apply an id or class to, so a style rule like:

    li h2 {
    padding-bottom:1em;
    }

    would affect the space below the heading. If you want to add space BELOW a list of pages or categories, adjust the rule that applies to the list itself (</ul>) as in:

    ul {
    padding-bottom:30px;
    }

    It helps to understand CSS and honestly, the above is TOO generic. I'd add a class to the tag (eg. ul class="pagelist") and define the style's bottom padding there.

    Between the list item, define bottom padding or line-height for li.cat_item or li.page_item... it depends on what type of list.

    What I wouldn't do is use line breaks <br /> (which is what you would use for xhtml, not <br /> and not </br>. Nor would I use paragraph tags when not using paragraphical content. Remember, html elements should be semantically correct.

    If you can point to a site with the examples in mind, a person could be more specific about how to get what you want.

    HTH

Topic Closed

This topic has been closed to new replies.

About this Topic