Click here to get back home

How to format unordered list?

 HomeNewsGroups | Search | About
 comp.infosystems.www.authoring.html    Post an article   get this group's latest topics as an RSS feed add this group's latest topics to your My MSN content add this group's latest topics to your My Yahoo content
Subject Author Date
How to format unordered list? deko 08-31-2006
Get Chitika Premium
Posted by deko on August 31, 2006, 9:08 am
Please log in for more thread options


There's a pretty good tutorial here:

http://www.mediacollege.com/internet/css/ul-list.html

but the problem is *none of the directive seem to be doing anything* for me.

What I want is a) no indentation, and b) an image as a marker.

From what I've read, the CSS should look something like this:

#sidebar ul {

list-style-image: url("/images/arrow.gif");
list-style-position: inside;

}

one joker in the pack is I have a class nested in an id:

<div id="sidebar">
<div class="sidebartext">
[php-generated lists here]
</div>
</div>

Should the CSS look like this:

#sidebar .sidebartext ul {

list-style-position:inside;
list-style-image:url(("/images/arrow.gif")

}

Other suggestions or examples?

Why can't I format my ul?



Posted by Chris F.A. Johnson on August 31, 2006, 9:32 am
Please log in for more thread options


On 2006-08-31, deko wrote:
> There's a pretty good tutorial here:
>
> http://www.mediacollege.com/internet/css/ul-list.html
>
> but the problem is *none of the directive seem to be doing anything* for me.
>
> What I want is a) no indentation, and b) an image as a marker.
>
> From what I've read, the CSS should look something like this:
>
> #sidebar ul {
>
> list-style-image: url("/images/arrow.gif");
> list-style-position: inside;
>
> }
>
> one joker in the pack is I have a class nested in an id:
>
><div id="sidebar">
> <div class="sidebartext">
> [php-generated lists here]
> </div>
></div>
>
> Should the CSS look like this:
>
> #sidebar .sidebartext ul {
>
> list-style-position:inside;
> list-style-image:url(("/images/arrow.gif")
>
> }
>
> Other suggestions or examples?
>
> Why can't I format my ul?

What is not working? Do you have a URL? (It works for me:
<http://cfaj.freeshell.org/testing/list.html>.)

Are you sure that the URL for the image is correct?

--
Chris F.A. Johnson <http://cfaj.freeshell.org>
===================================================================
Author:
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)

Posted by deko on August 31, 2006, 9:48 am
Please log in for more thread options


> What is not working? Do you have a URL? (It works for me:
> <http://cfaj.freeshell.org/testing/list.html>.)
>
> Are you sure that the URL for the image is correct?

Thanks for the reply.

I figured it out -

.sidebartext ul {
list-style-type:none;
list-style-position:inside;
padding:0 0 0 0;
margin:0 0 0 0;
list-style-image:url(/images/bullet.gif)
}

Padding was causing the indentation that I thought was ineffectual
list-style-positioning...


Posted by Wieland on September 4, 2006, 10:46 am
Please log in for more thread options


deko wrote:
> Padding was causing the indentation that I thought was ineffectual
> list-style-positioning...

Removing unwanted indents can be a pain if you're not aware that Opera
and IE add /margins/, while Firefox (Mozilla, Netscape) add /padding/
to list items. Be sure to set both margin *and* padding to 0 (as you
have). Just one of those things...


Posted by deko on September 5, 2006, 7:20 pm
Please log in for more thread options


>> Padding was causing the indentation that I thought was ineffectual
>> list-style-positioning...
>
> Removing unwanted indents can be a pain if you're not aware that Opera
> and IE add /margins/, while Firefox (Mozilla, Netscape) add /padding/
> to list items. Be sure to set both margin *and* padding to 0 (as you
> have). Just one of those things...

thanks for the tip. cross-browser compatibility is the bane of web
programming...


Similar ThreadsPosted
unordered list October 13, 2008, 2:04 pm
unordered list indentation bug in IE? August 3, 2006, 3:20 pm
[css] Anyways to get unordered list items to take up just as much space as they need? August 21, 2008, 3:18 pm
Definition List format adjustments August 8, 2007, 3:44 am
Format a list into multiple columns, or dynamically display columnsusing CSS? August 20, 2004, 12:15 am
Bad HTML tag format August 1, 2006, 11:33 am
Entering . to format January 5, 2008, 6:19 pm
date format in forms? July 15, 2004, 12:54 am
Format print using html? Please help October 5, 2004, 1:13 pm
Ending Tag Format Causes Problem May 13, 2005, 4:47 pm

Our other projects:

Art Dolls, Fairies and Mermaids - Sunnyfaces.net

Roy's Linux, Programming and Search Engines messages

1-Script XML SitemapXML Sitemap