[css-d] Text positioning in FF and Chrome - They go opposite ways

2012-02-13 Thread Andrew C. Johnston
Hi All, wonder if I can tap into the wetware database with a question.

I have a lot of teaser boxes that entice users to click on them, with text in 
the boxes. Nothing shaking or flashing or anything (yet).  Due to my design's 
limitations (or my own) I need to keep this box fairly short, I guess not 
anything over 100 px.

The problem is that FF and Chrome seem to handle the spacing I am doing in 
completely opposite ways, which makes the text in the box never quite centered. 
 

Check it out, newest Chrome and FF (Linux 
version): http://www.rayxi.com/lsat-exam-information-rayxi

In FF the text is a little too low, almost to the bottom border.  In Chrome, a 
little too high.

Any workaround for this?  Smaller box or bigger? Bigger box and smaller text? 
Maybe my margins and spacing are working at odds?

Any help would be appreciated.

Thanks in advance,

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


Re: [css-d] Text positioning in FF and Chrome - They go opposite ways

2012-02-14 Thread Ghodmode
On Tue, Feb 14, 2012 at 2:35 PM, Andrew C. Johnston
 wrote:
> Hi All, wonder if I can tap into the wetware database with a question.
>
> I have a lot of teaser boxes that entice users to click on them, with text in 
> the boxes. Nothing shaking or flashing or anything (yet).  Due to my design's 
> limitations (or my own) I need to keep this box fairly short, I guess not 
> anything over 100 px.
>
> The problem is that FF and Chrome seem to handle the spacing I am doing in 
> completely opposite ways, which makes the text in the box never quite 
> centered.
>
> Check it out, newest Chrome and FF (Linux 
> version): http://www.rayxi.com/lsat-exam-information-rayxi
>
> In FF the text is a little too low, almost to the bottom border.  In Chrome, 
> a little too high.
>
> Any workaround for this?  Smaller box or bigger? Bigger box and smaller text? 
> Maybe my margins and spacing are working at odds?

Set the height, font-size, and line-height to the same value.  In an
inline element, text is vertically centered on its line-height.

--
Vince Aggrippino
a.k.a. Ghodmode
http://www.ghodmode.com


> Any help would be appreciated.
>
> Thanks in advance,
>
> Andrew
__
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/