I was playing around with bullet and numbered lists for my
mobile first web sites today. And when you are pushing content to mobile devices becoming more aware of how you use white space becomes important. The ability to change margins and padding with ordered and unordered lists can reduce white space. using the following CSS to format you lists can considerably tighten up the lists for mobile.
ol, ul {
margin-top: 2px;
margin-left: 12px;
padding-left: 5px;
}
A web page presented with no CSS formatting for lists.
A web page presented with CSS formatting specifically displaying lists on a mobile device. Note how the list is further to the left and has less padding. The page displays with more content to white space. Great for mobile.
