Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4

Thread: Lists: indent

  1. #1
    New Coder
    Join Date
    Dec 2006
    Posts
    36
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Lists: indent

    Hi,

    You know when you make a list with <ol> or <ul>, it indents the text to the right like

    • this


    How do I use CSS to change the size of that indent? Like, I want the bullet before 'this' to be under the 'o' in 'You' instead of under the '[space]' like it is now.

    I've tried padding, but it change the padding relative to the <td> not relative to the rest of the text. I've tried text-indent but it changes the distance between the bullets and the text itself. I've also tried margin but it doesn't seem to do anything either.

  • #2
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Untitled Document</title>
    <style type="text/css">
    html, body {
    margin:0;
    padding:0;
    font-size:13px;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    }
    ul {
    margin:0;
    padding:0 0 0 24px;
    list-style-type:disc;
    }
    </style>
    </head>
    <body>
    You know when you make a list with ol or ul, it indents the text to the right like
    <ul>
    	<li>this</li>
    	<li>testing</li>
    	<li>third test</li>
    </ul>
    </body>
    </html>
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #3
    New Coder
    Join Date
    Dec 2006
    Posts
    36
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks, I tried that but I thought there was another way...

    edit: aahaa i thought it ignored the cellpadding but I forgot the list-style-position: outside; made it look that way in my case. nevermind, THANKS!
    Last edited by Ge64; 12-15-2006 at 07:20 AM.

  • #4
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Code:
    ul {
    text-indent: 1px;
    list-style-type:disc;
    }
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •