Re: [WSG] styling ordered and unordered lists
Whoops, should have read your code a bit more before hitting 'send'
Making the following change will give you better support in IE and
Opera while also keeping the arrow centered regardless of font-size -
> .mainleft ul li {
> padding: 0px 0px 0px 25px;
> background:transparent url(images/bullet.gif) no-repeat 6px 50%;
> margin-right: 0px;
> margin-bottom: 3px;
> margin-left: 0px;
> }
Andrew.
-
http://leftjustified.net/
--
http://leftjustified.net/
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
**
Re: [WSG] styling ordered and unordered lists
G'day I am trying to have an unordered list that is styled nicely with an arrow graphic, however now I get the arrow graphic in my ordered list as well. Easiest way to fix: Change .mainleft li to .mainleft ul li so it only applies to unordered lists, rather than ANY li element. Regards -- Bert Doorn, Better Web Design http://www.betterwebdesign.com.au/ Fast-loading, user-friendly websites ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help **
Re: [WSG] styling ordered and unordered lists
> I am trying to have an unordered list that is styled nicely with an arrow
> graphic, however now I get the arrow graphic in my ordered list as well.
Descendant selectors are your friend...
.mainleft ul li {
padding: 0px 0px 0px 25px;
background: url(images/bullet.gif) no-repeat 6px top;
margin-right: 0px;
margin-bottom: 3px;
margin-left: 0px;
}
Sorted ;)
Andrew.
-
http://leftjustified.net/
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
**
Re: [WSG] styling ordered and unordered lists
Hello Helen,
This might work:
ul
{ list-style: none;
list-style-image: url(../Images/Graphics/arrow.gif); }
Kind regards,
Mario
> Hi
>
> I am trying to have an unordered list that is styled nicely with an
> arrow graphic, however now I get the arrow graphic in my ordered list as
> well.
>
> Could someone please have a look here:
>
> http://learnline.cdu.edu.au/wip/css/liststest.html
>
> and give me an idea of what I can do to get around this. The lists are
> contained within a class called main left - assuming that this will
> eventually become the left column.
>
> Thanks very much
>
> ***
> Helen Rysavy
> Web Designer, Teaching & Learning Development
> Charles Darwin University, Northern Territory 0909
> Tel: 8946 7779 Mobile: 0403 290 842
> mailto:[EMAIL PROTECTED]
> www.cdu.edu.au
> CRICOS Provider No: 00300K
> ***
>
>
> **
> The discussion list for http://webstandardsgroup.org/
>
> See http://webstandardsgroup.org/mail/guidelines.cfm
> for some hints on posting to the list & getting help
> **
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
**
Re: [WSG] styling ordered and unordered lists
Yes, the background image is related to li
remove image from .mainleft li and add
.mainleft ul li {image info)
Bruce
www.bkdesign.ca
[EMAIL PROTECTED] wrote:
Hi
I am trying to have an unordered list that is styled nicely with an arrow
graphic, however now I get the arrow graphic in my ordered list as well.
Could someone please have a look here:
http://learnline.cdu.edu.au/wip/css/liststest.html
and give me an idea of what I can do to get around this. The lists are
contained within a class called main left - assuming that this will
eventually become the left column.
Thanks very much
***
Helen Rysavy
Web Designer, Teaching & Learning Development
Charles Darwin University, Northern Territory 0909
Tel: 8946 7779 Mobile: 0403 290 842
mailto:[EMAIL PROTECTED]
www.cdu.edu.au
CRICOS Provider No: 00300K
***
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
**
Re: [WSG] styling ordered and unordered lists
Your code should read:
.mainleft ul {
margin: 15px 0px;
padding: 0px;
list-style: none
}
.mainleft ol {
list-style-type: decimal;
}
.mainleft li {
padding: 0px 0px 0px 25px;
margin-right: 0px;
margin-bottom: 3px;
margin-left: 0px;
}
.mainleft ul li {
background: url(images/bullet.gif) no-repeat 6px top;
}
Add the parent to the style to get the desired output for UL's only.
doit4Jesus,
Chris Moncus
chrismoncus.com
AIM: HPPChrisMoncus
On Jan 9, 2005, at 11:00 PM, [EMAIL PROTECTED] wrote:
Hi
I am trying to have an unordered list that is styled nicely with an
arrow
graphic, however now I get the arrow graphic in my ordered list as
well.
Could someone please have a look here:
http://learnline.cdu.edu.au/wip/css/liststest.html
and give me an idea of what I can do to get around this. The lists are
contained within a class called main left - assuming that this will
eventually become the left column.
Thanks very much
***
Helen Rysavy
Web Designer, Teaching & Learning Development
Charles Darwin University, Northern Territory 0909
Tel: 8946 7779 Mobile: 0403 290 842
mailto:[EMAIL PROTECTED]
www.cdu.edu.au
CRICOS Provider No: 00300K
***
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
**
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
**
[WSG] styling ordered and unordered lists
Hi I am trying to have an unordered list that is styled nicely with an arrow graphic, however now I get the arrow graphic in my ordered list as well. Could someone please have a look here: http://learnline.cdu.edu.au/wip/css/liststest.html and give me an idea of what I can do to get around this. The lists are contained within a class called main left - assuming that this will eventually become the left column. Thanks very much *** Helen Rysavy Web Designer, Teaching & Learning Development Charles Darwin University, Northern Territory 0909 Tel: 8946 7779 Mobile: 0403 290 842 mailto:[EMAIL PROTECTED] www.cdu.edu.au CRICOS Provider No: 00300K *** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help **
