Here is a visual representation of the list I am working with:
--------------------
| | |
| 1 | 2 |
| | |
| 3 | 4 |
| | |
| 5 | 6 |
| | |
--------------------
The list is contained within a div.wrap element with a fixed width of 400 pixels. The list items are floated to the left with a 50% width.
My goal is to add a 10 pixel spacing between the left and right list items without disrupting the layout. Unfortunately, I do not have control over the HTML structure of the list items themselves, so I cannot add any additional classes to them.
I attempted to use margin-right: 10px on the <li> elements and margin-right: -10px on the <ul>, but this did not produce the desired result :)