WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Can't remove bullets from sidebar text (5 posts)

  1. antorera
    Member
    Posted 4 years ago #

    Hello,

    This is probably a silly CSS question. All I'm trying to do is remove the bullet from the general text in my sidebars that have a link (not the list items like Categories or recent posts). The theme is Swanky. I have tried every variation of Sidebar ul, Sidebar li, Sidebar ul li, Sidebar li a, Sidebar1 ul, etc.... but the bullets won't go (using list-style-type: none).

    http://inthegarlic.com/wordpress/

    The bullets I'm trying to remove are:

    Sidebar 1: "Available at Amazon"
    Sidebar 2: the bullets before the facebook and feed icons.

    Any ideas on what to try would be greatly appreciated!

  2. alchymyth
    The Sweeper & Moderator
    Posted 4 years ago #

    look here in the style.css - the 'bullet' is done by the background image:

    #sidebar1 li a {
    	background: url(images/img04.gif) no-repeat left 50%;
    	border: none;
    	padding-left: 10px;
    	text-transform: uppercase;
    }
    
    #sidebar1 li a:hover {
    	border: none;
    	padding-left: 10px;
    }
    
    #sidebar2 li a {
    	background: url(images/img04.gif) no-repeat left 50%;
    	border: none;
    	padding-left: 10px;
    	text-transform: uppercase;
    }
  3. esmi
    Forum Moderator
    Posted 4 years ago #

    In style.css, try:

    #sidebar1 li a.nobullet {
    list-style-type:none;
    }

    to remove the bullet on "Available at Amazon" then add the same "nobullet" class to the Facebook and Feed icons in the Text widget.

  4. antorera
    Member
    Posted 4 years ago #

    Thanks to esmi and alchymyth. Although I had tried the nobullet, I didn't have it applied to li a, just the a. Also, I ended up placing background:none in this same style and it worked. I also removed the extra padding on the left. I repeated the style for sidebar2 as well.

    #sidebar1 li a.nobullet {
      list-style-type:none;
      background: none;
      margin-left: 0px;
      padding-left: 0px
    }

    Of course, I wish there was a way to do this without having to specify a class on all special text in a widget. ;)

  5. rdpeters40
    Member
    Posted 4 years ago #

    I have a question re: a text widget I've put on a website I am putting together:

    http://tiny.cc/ldxmh

    The link is above. On the two bottom text widgets I've added a name.address on the second one a web address. There is a small mark on the "R" at first I thought it was the screen, but when I added the second text widget, the same small mark is there on the first letter also. I've searched the forums, thought they were bullets, followed the codes, but when I do, the white area disappears and you can't see anything (but I can see different bullets). Any help on how to get rid of this small mark would be greatly appreciated. dp

Topic Closed

This topic has been closed to new replies.

About this Topic