?
Solved

CSS Bullet Points

Posted on 2014-01-03
7
Medium Priority
?
368 Views
Last Modified: 2014-01-05
I want the code that has checkmark to have a checkmark for the bullet point.

.text-content ul .checkmark {list-style-image:url("../img/global/checkmark.png"); margin-left:25px;}

.text-content ul {list-style:square; margin-left:25px;}


<ul class="checkmark">
<li></li>
<li></li>
</ul>

<ul>
<li></li>
<li></li>
</ul>

Open in new window

0
Comment
Question by:Computer Guy
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 2
7 Comments
 
LVL 58

Expert Comment

by:Gary
ID: 39755211
Remove the space
ul .checkmark
becomes
ul.checkmark

I presume .text-content is the class of a container, else remove it.
0
 
LVL 8

Expert Comment

by:Adrian Crabtree
ID: 39755214
Hi audiotech520, instead of using list-style-image, you could try using a background image

.text-content ul .checkmark {
  background: url("../img/global/checkmark.png") no-repeat 0 0;
  padding-left: 25px;
  list-style: none;
}

Open in new window

0
 
LVL 3

Author Comment

by:Computer Guy
ID: 39755240
@cathal

Did not work.
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 58

Expert Comment

by:Gary
ID: 39755243
Why post an answer to a question that wasn't asked and then repeat the same mistake that was made.
0
 
LVL 58

Accepted Solution

by:
Gary earned 2000 total points
ID: 39755246
This is your code with the amendment (and a different image as I don't have yours)

http://jsfiddle.net/6Q34f/

I assume you have your css in style tags? i.e.

<style type="text/css">
.text-content ul .checkmark {list-style-image:url("../img/global/checkmark.png"); margin-left:25px;}

.text-content ul {list-style:square; margin-left:25px;}
</style>

Open in new window

0
 
LVL 3

Author Comment

by:Computer Guy
ID: 39755282
Worked!

Also do you know of any any scripts that allow real time code editing, but I can host on my own server? Like the jsfiddle.net
0
 
LVL 58

Expert Comment

by:Gary
ID: 39755289
Firebug for FF is the best you can get.
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Styling your websites can become very complex. Here I'll show how SASS can help you better organize, maintain and reuse your CSS code.
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
In this tutorial viewers will learn how add a full-size background image to a webpage using CSS3. Create a new HTML document with an internal stylesheet.: In CSS, define the html element to have a background image. Use a high resolution image.: In t…
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
Suggested Courses
Course of the Month12 days, 9 hours left to enroll

777 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question