Question

I’m not sure if this is possible, but I’m attempting to set up an ordered list with checkboxes in front of each list item, something like this:

1. I would like this to have a checkbox to the left of the item number and wrap to the first word in the sentence, not to the item number.
2. Same deal as item number 1, want a checkbox to the left of the item number and wrap to first word in sentence.

I’ve figured out the indenting stuff using this question, but haven’t been able to get the checkboxes to show up on the same line as the <li>. Is there any way to do this?

Here’s a jsFiddle I’ve been messing with.

Answer 1

http://jsfiddle.net/9v97V/2/

You can do something like this. You put the input inside the list item, then absolute position it so it appears before the list item.

Most relevant CSS:

li input
{
    position: absolute;
    margin-left: -40px;
    margin-top: 5px;
}