Skip navigation
Currently Being Moderated

How to center multiple text in a button

Apr 19, 2012 4:31 AM

Hello I have made a button in FW but it only centers the text correctly when I use one word.

When I type some thing like About Me it differs see attachment


  • Currently Being Moderated
    Apr 19, 2012 8:24 AM   in reply to Peter79879

    Are you using the Align panel? Select both the text and the rectangle simultaneously and choose the "horizontal center" and "vertical center" alignment options. (Or maybe just the "horizontal center" option in this case.)


    vertical and horizontal center.png


    Be sure that the "To Canvas" option is off.

    Mark as:
  • Currently Being Moderated
    Apr 22, 2012 10:29 AM   in reply to Peter79879

    Was this button a "rich symbol" from the Common Library? If so, are you editing the text from within the Symbol Properties panel?




    Unfortuntately, the version of Fireworks that I use (FW8) predates these features, so it's difficult for me to advise here. When I open the attached button, the text appears distored on the canvas. And in the symbol editor, the second word is missing entirely.


    on canvas.pnglibrary symbol.png

    Re-reading your last reply, are you saying that the problem occurs when you create the button or only when you scale the button? According to the following link, 9-slice scaling cannot be applied to a symbol containing text:


    Mark as:
  • Currently Being Moderated
    Apr 23, 2012 8:21 AM   in reply to Peter79879

    Sorry, I don't have these features...


    Just to be clear: In the example you've provided, there may be no need for 9-slice scaling as there are no rounded corners or other details that might distort when using a standard Transform command. (But perhaps you've provided a simplified example here?)


    Also, here's one workaround: If the button has a flat background, you could get away with inserting an "invisible character" to approximate the space. For example, insert a period (.) instead of a space and assign it the same color as the background.



    inserting character 3-step.png



    (Alternatively, I wonder if inserting a hard space, or non-breaking space, might work. I can't recall the keystroke for this—it might vary by operating system—but you could Google it and give it a try.)


    In case it's helpful to you, this 4-minute video offers a decent demonstration of the 9-slice scaling tool:


    Mark as:
  • Currently Being Moderated
    Apr 25, 2012 8:33 AM   in reply to Peter79879

    Whoah! All the content on that site ( seems to have disappeared overnight.


    Here's a link to the same 4-minute video from another site: ing-in.html

    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points