10Sep/092
Make Lists Align Properly
Bulleted lists can present many issues in formatting in older and newer browsers. I consistently run into a problem where my bulleted lists will slam up against the far left side of my division.
The fix for this issue is to use CSS to replace the standard bullet image with a left side margin and a background image as the bullet, or to remove the bullet image completely by placing a transparent background image as the bullet.
The CSS for the ul and li is as follows:
ul { white-space: normal; display: block; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 5px; } li { margin: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 3px; padding-left: 10px; list-style: disc url(none) outside; background-image: url(../images/bullet/bullet.gif); background-repeat: no-repeat; background-position: left top; }
Tagged as: bullets, definition, list, lists, ordered, unordered, web design
Leave a comment
Dashboard
Training Categories
Shaded Pixel LLC
- customwebdesigneronline.com
- JasonOney.com
- PHP Pachyderm
- Shaded Pixel LLC
- Shaded Pixels Photography
- youbelikedamn.net
September 10th, 2009 - 20:31
This is a sub-post level one
September 22nd, 2009 - 08:44
This is a child post