Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 4 of 4
  1. #1
    Member
    Join Date
    Nov 2005
    Posts
    55
    Member #
    11943
    I'm trying to figure out a way to align bulleted text (or numbered text) along the left margin instead of having it indented.

    Can I do something to the margins or padding that will make this happen. I've been experimenting but with no luck.

    Of course, it would be nice if the solution was cross browser/platform consistent.

    TIA

  2.  

  3. #2
    ljm
    ljm is offline
    Senior Member ljm's Avatar
    Join Date
    Aug 2006
    Location
    Manchester, England
    Posts
    284
    Member #
    13684
    Liked
    1 times
    Add this to your CSS:

    Code:
    // FOR THE li TAG
    margin: 0;
    padding: 0;
    
    // FOR THE ul TAG
    list-style: none;
    margin: 0;
    padding:0;
    Feel free to correct me. I'm not sure if setting the margin and padding is required for both, or just one of the two.

  4. #3
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    Meh. For safety's sake, I always set it on both. You never know what IE out there could have margins set on the ul, too...

  5. #4
    Member
    Join Date
    Nov 2005
    Posts
    55
    Member #
    11943
    This worked, except I wanted to keep the bullets.

    You got me started though. By changing the list-style to "disc" (or using the default) and adjusting the left margin in the <ul> to "15px" it did what I wanted it to do. I had to experiment with the size of the left margin; 15 seems to be the right number.

    Tested on Firefox, Safari, and IE (on a PC - Firefox and Netscape on a PC as well). Latest versions of all. They all looked okay.

    Firefox (both platforms) and Netscape were a couple pixels to the right of flush left, but close enough for my purposes.

    Thanks for the help.

    Code:
    // FOR THE li TAG
    margin: 0px;
    padding: 0px;
    
    // FOR THE ul TAG
    list-style: disc;
    margin: 0px 0px 0px 15px;
    padding: 0px;


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 10:27 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com