Need CSS Help For Removing Bullets

On my website at http://hydroponicsoils.com/ I am using custom images for bullets. Can you tell me please

1. how do I delete the default black circles and
2. indent my list.

Support Access is granted.
Thank you.

  • Adam Czajczyk

    Hello Mary,

    I hope you're fine today!

    I checked the site and this CSS would do the job now:

    /* remove bullet points and "standarize" list*/
    .my-list {list-style:none;display:block;width:auto;overflow:hidden;}
    
    /* add images instead of bullet points */
    .my-list li {
    	background:url('http://hydroponicsoils.com/wp-content/uploads/2016/12/wonderful-soils-bullet-12px.png') center left no-repeat;
    	/* change this value to increase/decrease space between text and image */
    	padding-left:25px;
    	/* change this value to increase/decrease indent */
    	margin-left:25px;
    }

    There's one more change however that you will want to do on the site. The images (image "points" for the list) are currently included in content - as list content part. Remove them please as otherwise you'll got them "doubled".

    Once this is done you should end up with a nicely formatted list and furthermore, anytime you add another list the same way, it will automatically keep that formatting.

    You can also customize the amount of space between that "image list point" and list item text and the indent itself (see comments in CSS code).

    Best regards,
    Adam

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.