WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Remove bullets from text widget (6 posts)

  1. CharlieLivingston
    Member
    Posted 1 year ago #

    So in Chrome, not Firefox, there's a bullet appearing before the 'Best Hosting' title in a text widget in my sidebar, and I can't work out why. Possibly there's something wrong with the HTML in the list before? But I'm not sure what...

    Help appreciated.

    My site can be found here.

  2. CrouchingBruin
    Member
    Posted 1 year ago #

    When I examine the widget using Firebug in Chrome, it looks like it uses the "user agent stylesheet" to style the widget, which is an LI (list item) element. Meaning it uses whatever the default style is in Chrome for LI, and that style is:

    li {
    display: list-item;
    text-align: -webkit-match-parent;
    }

    Which is why you're seeing a bullet (it tries to display the widget as a list item, since it is, in fact, a list item).

    See if you can add this CSS somewhere:

    .sidebar li {
    display : inline;
    }
  3. CharlieLivingston
    Member
    Posted 1 year ago #

    So adding that CSS has removed the bullet, which is great, but it has messed up the spacing of the sidebar a bit. Everything's closer together.

  4. CrouchingBruin
    Member
    Posted 1 year ago #

    Then add a margin-top to your widget LI DIV elements:

    .sidebar li {
    display : inline;
    }
    
    .sidebar li div {
    margin-top: 20px;
    }
  5. CharlieLivingston
    Member
    Posted 1 year ago #

    Using this code and everything's dandy:

    .sidebar li {
    list-style-type:none;
    }

    Thanks again for the help. :)

  6. CrouchingBruin
    Member
    Posted 1 year ago #

    Ah, great, congrats!

Topic Closed

This topic has been closed to new replies.

About this Topic