On Thu, Sep 4, 2014 at 9:29 AM, Philippe Wittenbergh <e...@l-c-n.com> wrote:
>
> Le 4 sept. 2014 à 00:31, Tom Livingston <tom...@gmail.com> a écrit :
>
> > If you look carefully at the image I linked to, the text and arrow image
> > aren't well centered vertically. It look better in Safari. I know
> vertical
> > centering is a bit annoying but is there a better way to go about this
> > structure/style?
>
> subpixel positioning - depends on the rendering engine and is platform
> dependent (and resolution dependent). Not much you can do about it.
>
> One possibility: set the line-height to '1' on the element. Might help a
> little by making the line box the same size as the font-size.
>
> Le 4 sept. 2014 à 00:50, Tom Livingston <tom...@gmail.com> a écrit :
>
> > Also, I can't use background-position: 100% 50%; in this case as the
> arrow
> > is a sprite which changes position on hover. The sprite is an image of
> two
> > different colored arrows that move up and down on hover via
> > background-position.
> >
> > .button{
> > background-position: 100% 0;
> > }
> > .button:hover{
> > background-position: 100% -43px;
> > }
>
> <sigh> I rarely use those things :-) (hate hover effects with a passion).
>
> In the future, CSS blend modes may alleviate the need for multiple images…
>
>
> Philippe
> --
> Philippe Wittenbergh
> http://l-c-n.com/
>
>
Thank you! I'll give the line-height suggestion a test. Not sure why I
didn't think of that... :-/
--
Tom Livingston | Senior Front-End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
