I find the items of ol have left margin, but <p>This is first row</p> haven't left margin, so these three rows cannot left align. How can I make them left-aligned? Thanks!
You can see the result at:
or in Dropbox at:
https://www.dropbox.com/s/nr4bb00sd80pgl9/Mycss.PNG
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
     <style type="text/css">
       li.A {
          list-style-type: decimal;
          font-weight: bold;
           margin-bottom:15px;          
        }
        li.B{
          list-style-type:upper-alpha;
          font-weight:normal;
          margin-top:4px;
          margin-bottom:4px;   
        }
        ol.C {
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <p>This is first row</p>
        <ol>
            <li class="A">DIY SMS Export V1.05 has been released
                <ol class="C">
                    <li class="B">Add the function to delete sms selected</li>
                </ol>
            </li>
            <li class="A">DIY SMS Export V1.04 has been released
                <ol class="C">
                    <li class="B">Add chinese language support</li>
                </ol>
            </li>
        </ol>  
    </div>
    </form>
</body>
</html>
Have you tried adding the css:
ol{ padding-left:0; list-style-position:inside; }
working jsFiddle
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With