Hi Thomas,
Played with your solution but it doesn't workout very well as using
list-style-image looks different in different browsers, for example IE
places the image as the top, and FF at the bottom :(...
This is a well known issue and that's why people advice to use the
background-image.
However, that that doesn't work as the backgroun images is repeated
fully and ignores the background-repeat attribute.
For example, doing something like this won't work:
@url simpleBulletPic simpleBulletPic;
ul.bulletSimple li {
background-repeat: none;
background-position: 0 7px;
background-image: simpleBulletPic;
}
Any idea why this doesn't work?
On Aug 11, 4:14 pm, Thomas Broyer <[email protected]> wrote:
> On 4 août, 16:57, Ed <[email protected]> wrote:
>
> > Anybody any idea how to use gwt sprites with bullets in css?
> > Normally you would use gwt sprites in css like this:
>
> > @sprite ul.bulletSimple li {
> > gwt-image: "bulletSimple";
> > }
>
> > But this will cause that GWT adds the width and height according to
> > the image dimensions. This results in a list item with unwanted
> > dimensions.
> > Normally you can solve this with a div that wraps the div containing
> > the image.
> > However how to do this with a bullet list item?
>
> You don't want "spriting" (possibly compositing multiple images into a
> single file and using CSS hacks/tricks to only show the portion you
> want), that won't work with list-style-image which expects a <uri>.
> Instead, you should use a DataResource:
>
> @url bulletSimple bulletSimple;
> ul.bulletSimple li {
> list-style-image: bulletSimple;
>
> }
>
> seehttp://code.google.com/webtoolkit/doc/latest/DevGuideClientBundle.htm...
--
You received this message because you are subscribed to the Google Groups
"Google Web Toolkit" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.