CODEWITHSUNDEEP
cssipadlisthtml-lists
Jason
Jason

Reputation: 15378

How can I have dashes on my ul li, when some of my li's have two lines (ipad)

I'm working on the css / html for this ipad page.

enter image description here

Here's my code: http://jsfiddle.net/KaWpZ/1/

What CSS do i need to use to get dashes? and why can't I make them align properly on so that the text on the second line (like Sport, eco, normal etc) sits padded and not underneath the dash.

Thanks

Upvotes: 0

Views: 2686

Answers (1)

David Thomas
David Thomas

Reputation: 253396

With an iPad you've got access to the :before pseudo-element, allowing you to use:

ul li{
    padding-left: 1em;
    position: relative; 
}

ul li:before {
    content: '-';
    position: absolute;
    left: 0;
}

JS Fiddle demo

Upvotes: 2

Related Questions