By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,624 Members | 2,179 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,624 IT Pros & Developers. It's quick & easy.

CSS Button text centered vertically

P: n/a
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
Share this Question
Share on Google+
1 Reply


P: n/a
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.