Re: [css-d] images + markers in lists?

2006-02-07 Thread Kenny Graham
Most browsers use padding for the list indentation, but IE uses
margins. (or is it the other way around?)  If you set margins on the
lis to zero (or whatever you need) then specify an indentation using
padding, it should look the same in various browsers.
__
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] images + markers in lists?

2006-02-07 Thread francky
Steve Lockwood wrote:

Is it possible to have a standard list with a marker like a disc plus an image 
as part of the list item? When I use liimg src=image.gif 
style=float:left, the image displays on top of the marker--at least in 
IE6.x on Windows XP and in Safari in OS X 10.3  10.4. Oddly, IE5.x and 
Firefox 1.5 in OS X 10.3  10.4 display the marker followed by the image, 
which is what I need.

Any ideas appreciated!
  

Hi Steve,
You can add the image as a background image in the css:
li {
 background: url('http://www./yourbg-img.gif') no-repeat 
100%  50%; /* horizontal % vertical %; also px or em is possible */
}
In the html just the litext/li.

That is: in this case yourbg-img.gif will be placed at 100% from left (= 
starting at the right side of the li-width, and then to the left), and 
vertically just centered in the line.
Perhaps the line-height has to be adapted to get the whole image displayed.

francky
__
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/