[css-d] changing backgrounds in list items

2006-09-13 Thread vwf 
Hello,

I have a list with a backgound that appears when I hover over it:

#navlist ul li a:hover {
   background: url(image1.png);
   background-repeat: no-repeat;
   }

I have a list of 6 items, and I want to associate a different image with
each of the 6 items. Is there a smart/correct way to do this? Does
someone know an example that has this implemented?

Thank you.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] changing backgrounds in list items

2006-09-13 Thread Professional Web Pages - Information 
To be honest you could try and place ID's on each LI item and put 
backgrounds on them


your trying to create a roll over menu correct?

Regards
PWP


- Original Message - 
From: vwf [EMAIL PROTECTED]
To: css-d@lists.css-discuss.org
Sent: Wednesday, September 13, 2006 7:58 PM
Subject: [css-d] changing backgrounds in list items


 Hello,

 I have a list with a backgound that appears when I hover over it:

 #navlist ul li a:hover {
   background: url(image1.png);
   background-repeat: no-repeat;
   }

 I have a list of 6 items, and I want to associate a different image with
 each of the 6 items. Is there a smart/correct way to do this? Does
 someone know an example that has this implemented?

 Thank you.
 __
 css-discuss [EMAIL PROTECTED]
 http://www.css-discuss.org/mailman/listinfo/css-d
 IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
 List wiki/FAQ -- http://css-discuss.incutio.com/
 Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
 


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] changing backgrounds in list items

2006-09-13 Thread Bradley Wright 
On 13/09/2006 10:58, vwf wrote:
 I have a list of 6 items, and I want to associate a different image with
 each of the 6 items. Is there a smart/correct way to do this? Does
 someone know an example that has this implemented?

I'd just add an ID or class (but more probably ID) to each of the list 
items or anchor elements.

So something like:

.nav li a {
background-repeat: no-repeat;
background-align: 0 0;
... other common styles...
}

.nav li a#home {
background-image: url(images/home.png);
}

etc.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] changing backgrounds in list items

2006-09-13 Thread Bradley Wright 
Sorry, need to fix my code sample:

.nav li a:hover {
background-repeat: no-repeat;
background-align: 0 0;
... other common styles...
}

.nav li a#home:hover {
background-image: url(images/home.png);
}
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

[css-d] changing backgrounds in list items

2006-09-13 Thread vwf 
On 13/09/2006 10:58, vwf wrote:
 I have a list of 6 items, and I want to associate a different image
 with
 each of the 6 items. Is there a smart/correct way to do this? Does
 someone know an example that has this implemented?

Thank you all for the various suggestions.

It seems that the straight-forward approach is the way to go:
simply add extra classes or id's for each of the elements.
I implemented it, and it works perfectly.

One question: why would I prefer 'id' over 'class' selectors?

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] changing backgrounds in list items

2006-09-13 Thread Professional Web Pages - Information 

Depends if 2 items in your list will have the same background then you would 
use a class (think of a class as a group)

if every item in your list each has seperate then you would use ID (think of 
an ID and an individual name)

use ID if its 1
use CLASS if its greater then 1

to be considered on the one page (used more then once on the one 
page)

Regards
PWP


- Original Message - 
From: vwf [EMAIL PROTECTED]
To: 
Sent: Wednesday, September 13, 2006 9:08 PM
Subject: [css-d] changing backgrounds in list items


 On 13/09/2006 10:58, vwf wrote:
 I have a list of 6 items, and I want to associate a different image
 with
 each of the 6 items. Is there a smart/correct way to do this? Does
 someone know an example that has this implemented?

 Thank you all for the various suggestions.

 It seems that the straight-forward approach is the way to go:
 simply add extra classes or id's for each of the elements.
 I implemented it, and it works perfectly.

 One question: why would I prefer 'id' over 'class' selectors?

 __
 css-discuss [EMAIL PROTECTED]
 http://www.css-discuss.org/mailman/listinfo/css-d
 IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
 List wiki/FAQ -- http://css-discuss.incutio.com/
 Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
 


__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] changing backgrounds in list items

2006-09-13 Thread Alex Bienz 

Thank you all for the various suggestions.

It seems that the straight-forward approach is the way to go:
simply add extra classes or id's for each of the elements.
I implemented it, and it works perfectly.

One question: why would I prefer 'id' over 'class' selectors?


ID's should be used to uniquely identify elements in your page, classes
are for groups of elements that share similar properties.  If your list
is only used once on the page then ID's would be the best thing to use.
Use classes if your list is replicated within each page.

Hope this helps.

Alex.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] changing backgrounds in list items

2006-09-13 Thread Matt Ludbrook 
 
If I remember correctly CSS3 has a spec for identifying different items in a
list in various ways but seeing as noone really implements 3 yet you
probably don't have a heuristically clean way of doing this.


Matt Ludbrook

EMIC associates

Engineering, Maintenance, and Inventory Consultancy

+44 7940 854119 (Mobile)

+44 23 92 610437 (Direct)

www.emicassociates.co.uk

 


-Original Message-
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] On Behalf Of Alex Bienz
Sent: 13 September 2006 12:15
To: vwf; css-d@lists.css-discuss.org
Subject: Re: [css-d] changing backgrounds in list items


Thank you all for the various suggestions.

It seems that the straight-forward approach is the way to go:
simply add extra classes or id's for each of the elements.
I implemented it, and it works perfectly.

One question: why would I prefer 'id' over 'class' selectors?


ID's should be used to uniquely identify elements in your page, classes are
for groups of elements that share similar properties.  If your list is only
used once on the page then ID's would be the best thing to use.
Use classes if your list is replicated within each page.

Hope this helps.

Alex.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org --
http://www.evolt.org/help_support_evolt/

--
No virus found in this incoming message.
Checked by AVG Free Edition.
Version: 7.1.405 / Virus Database: 268.12.3/446 - Release Date: 12/09/2006
 

-- 
No virus found in this outgoing message.
Checked by AVG Free Edition.
Version: 7.1.405 / Virus Database: 268.12.3/446 - Release Date: 12/09/2006
 

__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/