CODEWITHSUNDEEP
htmlcsslist
winstonclark
winstonclark

Reputation: 35

list-style-type:none & list-style:none not working

I'm having trouble removing list bullets - I've tried both list-style-type:none & list-style:none, both inline and in the CSS file. Also tried adding !important all to no avail. Here's what I've got:

<ul id="work">
    <li><img src="#" /><p>SERVICE 1</p></li>
    <li><img src="#" /><p>SERVICE 2</p></li>
    <li><img src="#" /><p>SERVICE 3</p></li>
</ul>



#work ul {
   list-style-type: none;
}

#work li {
   list-style-type: none;
   clear: both;
}

#work li img {
   float: left;
   padding-right: 25px;
   margin-bottom: 25px;
}

#work li p {
   height:240px;
}

Upvotes: 0

Views: 3661

Answers (1)

C3roe
C3roe

Reputation: 96306

Your selector doesn’t match anything – #work ul would select any UL elements inside the element that has the id work.

If you want to select the HTML element <ul id="work">, then use ul#work, or just #work (when ids are involved, it is in most cases not necessary to be any more specific.)

Edit:
So, after you’ve shown the link to your page, it becomes clear that your issue is not with list-style at all – that works fine, your LI do not have a list style.

But what they do have, is a pseudo element – and that is what creates the small dark-pink dot.

http://answersfornewactors.com/wp-content/themes/gardeniablog/style.css, line #2483:

.post_content ul > li:before {
    font-family: "fontello";
    content: '\e8e4';
    font-size: 0.5em;
    display: inline-block;
    vertical-align: middle;
    text-indent: -2em;
}

Upvotes: 4

Related Questions