Button Value Text Align

[christrinder]

Hello,

I have tried every combination of syntax that I can think of, but nothing seems to align the text value of a button at the top or bottom of the buttom. Does anybody know the secret command to do so, or is it just not possible?

Thanks,

Chris

[Catman]

If I'm understanding your question, this should do it:

<button>This is Some Text at the Top<br /><br /></button>
<button><br />This is Some Text at the Bottom</button>

[cg9com]

<input type="button" /> is more widely supported
you could try \n for formatting, but i doubt its the right way.

[bk1]

Not exactly sure what you're trying for here... Do you still want the text to appear inside the button or above/below it?

If you want it inside, you could adjust the padding of the button to achieve this type of appearance...

<input type="button" value="align top" style="padding: 0 0 5px;" />

<input type="button" value="align bottom" style="padding: 5px 0 0;" />

[MrDoubtFire]

Could you use margin's for auto-alignment, like so:

<input type="button" value="button value" style="margin-left:auto; margin-right:auto;" />

MrDF

[bk1]

margins will adjust the postion of the button itself, not the text value inside it.

[MrDoubtFire]

Then, maybe:

<input type="button" value="button value" style="padding-left:auto; padding-right:auto;" />

? just a thought!

[bk1]

I think the original poster is looking for vertical alignment of the text value - not horizontal.

To control the horizontal alignment of the text,
text-align: left | center | right
would be the way to do it.

[MrDoubtFire]

I think the original poster is looking for vertical alignment of the text value - not horizontal.

Then try variations on the padding-[top/bottom]. You could set one or the other to force the text to the opposite side (e.g., setting padding-top to 10px would force the text towards the bottom of the button).

MrDF

[bk1]

Originally posted by MrDoubtFire
Then try variations on the padding-[top/bottom]. You could set one or the other to force the text to the opposite side (e.g., setting padding-top to 10px would force the text towards the bottom of the button).


try reading through the thread again.