www.webdeveloper.com
Results 1 to 10 of 10

Thread: [RESOLVED] UL list marker showing up at the end of the line

  1. #1
    Join Date
    Jan 2009
    Posts
    42

    resolved [RESOLVED] UL list marker showing up at the end of the line

    The first list marker always shows up at the end of the line for me.
    Here is the code:

    Code:
    ul.prod_txt
    {
    	font-family:Tahoma;
    	font-size:13px;
    	color:#364049;
    	padding-bottom:10px;
    	padding-top:0px;
    	margin:auto;
    	text-align:left;
    }
    <ul class="prod_txt">
    <li>Compact physical footprint for streamlined portability</li>
    <li>Intuitive user interface for out-of-the-box functionality</li>
    <li>Water, shock and dust resistance for unparalleled durability</li>
    <li>Enhanced SMS and email messaging capability</li>
    <li>Integrated speakerphone</li>
    <li>Headset and hands-free capability</li>
    <li>Internally stowed antenna</li>
    <li>Mini-USB data port</li>
    </ul>
    Here is an image of what is happening:
    Attached Images Attached Images

  2. #2
    Join Date
    Aug 2007
    Location
    New Jersey, US
    Posts
    1,779
    your code is fine. it has to be something else... do you have a link?

    it looks like a float problem to me. who knows...

  3. #3
    Join Date
    Jan 2009
    Posts
    42
    I actually don't have a link because it is on an internal server. It is within a div layer called RP_Content which is inside a div called body_container. Here are the styles:

    Code:
    #RP_Content
    {
    	width:725px;
    	float:right;
    	margin:0;
    	padding:0px;
    	text-align:left;
    	margin-right:40px;
    	clear:right;
    }
    #body_container
    {
    	width:1024px;
    	margin:auto;
    	padding:0px;
    	background-image: url(../Images/Sat_Home_Mid-Bg.jpg);
    	background-repeat:repeat-y;
    	text-align:center;
    }
    #body_container a 
    {
    	color: #587290;
    }
    body 
    {
    	background-color:#A4AAB0;
    	text-align:center;
    	margin:auto;
    	padding:0px;
    	font-family:Tahoma;
    }

  4. #4
    Join Date
    Aug 2007
    Location
    New Jersey, US
    Posts
    1,779
    Aerofanatic,

    This still isn't enough info to try to troubleshoot this problem.

    How about posting the entire page and full CSS? Or, better yet, put the two files in a .zip and attach them?

  5. #5
    Join Date
    Jan 2009
    Posts
    42
    Here are the files
    Attached Files Attached Files

  6. #6
    Join Date
    Aug 2007
    Location
    New Jersey, US
    Posts
    1,779
    I don't see any
    HTML Code:
    <ul class="prod_txt">
    ...
    </ul>
    on that page.

    Anyway, you know you have 2 prod_txt classes?

    You have one for P tags, and another for UL. Is this supposed to be like that? So maybe the one class' properties are messing the other one's up. If I were you, I'd make the UL one something like "prod_list" to separate the two different styles.

  7. #7
    Join Date
    Jan 2009
    Posts
    42
    oops... sorry look for
    class="stat_content"

    on these pages... stat_content and prod_txt are the same things, except just a different width and color...

  8. #8
    Join Date
    Aug 2007
    Location
    New Jersey, US
    Posts
    1,779
    oh - it looks like this is because the <p> before it (<p class="stat_content"...>) is floated left...

    since it's floating left, the UL is trying to fill in the space on the right, if that makes sense.
    You probably have to clear:left; on the UL to fix this.

    I don't have a testing server set up at work, so I'm not able to test it out....

  9. #9
    Join Date
    Jan 2009
    Posts
    42
    Hey, that seems to work, but it just adds a whole lot of unnecessary space. I just removed the float, which seemed to work.
    Thanks a lot for your help!

  10. #10
    Join Date
    Aug 2007
    Location
    New Jersey, US
    Posts
    1,779
    No problem. Glad it worked out.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles