467,874 Members | 1,797 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 467,874 developers. It's quick & easy.

CSS Button text centered vertically

Hello,

I want to make a button that automatically resizes according to the
text length and the font size (which can be changed in firefox pretty
easily with the browser).

The button already works for resizing horizontally, the problem is
when I enlarge the text using firefox, the text doesnt stay aligned
with the button. If the text is larger, the text is not centered
vertically in the button.

Here is my code,
http://mofstudios.com/maxime/test/test.html

I need a solution that the text will stay centered in the button
whatever size the text is.
It also needs to work in IE

Thank you for helping me
Max
Feb 8 '08 #1
  • viewed: 5359
Share:
1 Reply
Maxime wrote:
>
when I enlarge the text using firefox, the text doesnt stay aligned
with the button. If the text is larger, the text is not centered
vertically in the button.

http://mofstudios.com/maxime/test/test.html
It's only doing what you told it to do:
background: url(./images/btny_l.gif) no-repeat left top;

Notice the "top" vertical position.
I need a solution that the text will stay centered in the button
whatever size the text is.
I don't think you can do it with the single image you're using for both
normal and :hover states. Make 2 images, one for each state, and
vertically position it center instead of top.

--
Berg
Feb 8 '08 #2

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

5 posts views Thread by Wilhelm Kutting | last post: by
6 posts views Thread by Jerry Camel | last post: by
4 posts views Thread by tomasio | last post: by
18 posts views Thread by ~john | last post: by
reply views Thread by pamelafluente | last post: by
reply views Thread by jack112 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.