Page 1 of 2 12 LastLast
Results 1 to 15 of 17

Thread: Bullets line up

  1. #1
    4 Star Lounger
    Join Date
    Feb 2006
    Posts
    504
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Bullets line up

    Hi,

    For some reason, my seond line of bullets doesn't line up, please see below:

    Test Test Test Test Test Test Test
    Test Test Test Test Test Test Test Test
    Test Test Test Test Test Test Test
    Test Test Test Test Test Test Test Test

    How can I modify my codes to show as the follow:

    Test Test Test Test Test Test Test
    Test Test Test Teset Test Test Test
    Test Test Test Test Test Test Test
    Test Test Test Test Test Test Test

    I am using the css style and below is the line codes:

    .nav ul {
    text-align:left;
    list-style-type:none;
    display:block;
    margin:10px;
    padding:0;
    }

    Thanks in advance

    Regards

  2. #2
    Super Moderator jscher2000's Avatar
    Join Date
    Feb 2001
    Location
    Silicon Valley, USA
    Posts
    23,112
    Thanks
    5
    Thanked 93 Times in 89 Posts

    Re: Bullets line up

    I'm not sure whether your post really reflects what you meant. Can you post the HTML of your unordered list or use <!t>[pre]<!/t> <!t>[/pre]<!/t> markup around your illustration to make it line up (right now the two examples look roughly the same to me)?

  3. #3
    4 Star Lounger
    Join Date
    Feb 2006
    Posts
    504
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Bullets line up

    Below is my html codes of unordered list:



    *</p>

    [*]
    <font face="Verdana" style="font-size: 8pt">I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem.</font>
    [*]
    <font face="Verdana" style="font-size: 8pt">I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem.</font>
    [*]
    <font face="Verdana" style="font-size: 8pt">I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem.</font>
    [*]
    <font face="Verdana" style="font-size: 8pt">I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem.</font>
    [*]
    <font face="Verdana" style="font-size: 8pt">I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem.</font>
    [*]
    <font face="Verdana" style="font-size: 8pt">I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. </font>


    *</p>


    Thanks

  4. #4
    Plutonium Lounger
    Join Date
    Mar 2002
    Posts
    84,353
    Thanks
    0
    Thanked 29 Times in 29 Posts

    Re: Bullets line up

    If you want a real unordered list, you should place a <ul> tag before the first[*] and a[/list]tag after the last .

    Note: you have switched the last </font> and .

  5. #5
    4 Star Lounger
    Join Date
    Feb 2006
    Posts
    504
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Bullets line up

    Thanks, Hans.

    After I add those two <ul> tags and the bullter is disappeared. Please see codes below:



    </p>

    <ul>[*]
    <font face="Verdana" style="font-size: 8pt">I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem.</font> [*]
    <font face="Verdana" style="font-size: 8pt">I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem.</font> [*]
    <font face="Verdana" style="font-size: 8pt">I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem.</font> [*]
    <font face="Verdana" style="font-size: 8pt">I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem.</font> [*]
    <font face="Verdana" style="font-size: 8pt">I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem.</font> [*]
    <font face="Verdana" style="font-size: 8pt">I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem. I have problem.</font> <ul>


    </p>

    I would like to keep bullets, but the second line of each bullet I would like to line up with text, not bullet. Sorry for unclear info.

    Thanks

  6. #6
    Plutonium Lounger
    Join Date
    Mar 2002
    Posts
    84,353
    Thanks
    0
    Thanked 29 Times in 29 Posts

    Re: Bullets line up

    If I paste your HTML into a text file (with <html><body> before it and </body></html> after it, I get what is shown in the screenshot below.
    Attached Images Attached Images
    • File Type: png x.png (2.1 KB, 0 views)

  7. #7
    4 Star Lounger
    Join Date
    Feb 2006
    Posts
    504
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Bullets line up

    Thanks, Hans.

    Do you think there's something to do with css. I am using the css style and below is the line style codes:

    .nav ul {
    text-align:left;
    list-style-type:none;
    display:block;
    margin:10px;
    padding:0;
    }

    Thanks

  8. #8
    Plutonium Lounger
    Join Date
    Mar 2002
    Posts
    84,353
    Thanks
    0
    Thanked 29 Times in 29 Posts

    Re: Bullets line up

    The line

    list-style-type:none;

    specifies that you don't want bullets. You can either omit this line or change it to

    list-style-type:disc;

  9. #9
    4 Star Lounger
    Join Date
    Feb 2006
    Posts
    504
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Bullets line up

    I either change to list-style-type:disc; or omit this line. The whole pages lose the format, it seems like ccs doesn't apply to the web pages.

    Any idea?

  10. #10
    Plutonium Lounger
    Join Date
    Mar 2002
    Posts
    84,353
    Thanks
    0
    Thanked 29 Times in 29 Posts

    Re: Bullets line up

    Sorry, I'll have to leave this to other Loungers who know more about CSS.

  11. #11
    Super Moderator
    Join Date
    Jun 2002
    Location
    Mt Macedon, Victoria, Australia
    Posts
    3,993
    Thanks
    1
    Thanked 45 Times in 44 Posts

    Re: Bullets line up

    Can you paste all of the css, and all of the html into a text file and attach them?

    Your css for <ul> looks like it is intended to provide a list style menu, but because it starts with

    .nav ul {

    it should only apply to lists within a <div> that has the class nav.

    <pre><div class="nav"></pre>


    If your list is within such a Div move the end of the Div to before the start of the list.
    Regards
    John



  12. #12
    Platinum Lounger
    Join Date
    Feb 2002
    Location
    A Magic Forest in Deepest, Darkest Kent
    Posts
    5,681
    Thanks
    0
    Thanked 1 Time in 1 Post

    Re: Bullets line up

    Hi Gary

    The problem that you are facing at the moment is that you appear to be over complicating the HTML . Hopefully I have simplified it for you by removing the unwanted Font tags which can be easily placed in the CSS style like follows:

    <pre>.nav ul {
    text-align:left;
    list-style-type:circle;
    display:block;
    margin:10px;
    padding:0;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;

    }
    </pre>


    I have also ensured that I used a font family for citizens who may not have one or more of the fonts installed on their client PC.

    There was also a problem with the fact that the UL tag was not closed propoerly and be it that you are a IE7 user it may not have as forgiving as older version of IE were. Finally, as other have mentioned, your code snippet did not have the UL tags nesting within a DIV tag.

    I have attached the file with my modifications
    Jerry

  13. #13
    4 Star Lounger
    Join Date
    Feb 2006
    Posts
    504
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Bullets line up

    Thanks for all of your help. Here is my situation now: After I insert <div class="nav">
    <ul>

    and then the bullets lines up. However, the bullets disappeared as soon as I put css file. I have attached both my css & html codes.

    Thanks again for all of your help.

    Regards
    Attached Files Attached Files

  14. #14
    Super Moderator jscher2000's Avatar
    Join Date
    Feb 2001
    Location
    Silicon Valley, USA
    Posts
    23,112
    Thanks
    5
    Thanked 93 Times in 89 Posts

    Re: Bullets line up

    Your CSS file has an explicit instruction to NOT display the bullets. The attached page illustrates a list with a default list style and your list styles.
    Attached Files Attached Files

  15. #15
    4 Star Lounger
    Join Date
    Feb 2006
    Posts
    504
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Re: Bullets line up

    Thank you so much, jscher2000.

    I don't why after I modified the codes and retry it with CSS and html, I still can't see the bullets. Do you mind to take a look again on the attached my style & html file?

    Thank you so much for your help.
    Attached Files Attached Files

Page 1 of 2 12 LastLast

Posting Permissions

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