Flash hyperlinks spacing error

Answer 1

Does it make any difference if you put non-breaking spaces immediately before and after the anchor element?

<p> ... &nbsp;<a ... >Link text</a>&nbsp; ... </p>

Admittedly a workaround at best but it might buy you some time to research a real solution.

Answer 2

Make sure you styleSheet declares what it is supposed to do with Anchors. You are obviously using htmlText if your using CSS so soon as it sees < in front of "a href" it immedietly looks for the CSS class definition for a and when it doesn't find one, the result is the different looking text you see.

Add the following to your CSS and make sure that it has the same settings as the regular style of your text as far as style, wieght, and size. The only thing that should differ is the color.

a:link
{
   font-family: sameAsReg;
   font-size: 12px; //Note flash omits things like px and pt.
   color:#FF0000; //Red
}

Be sure that the fonts you are embedding are in the library and being instantiated into your code. Embedding each textfield through the UI is silly when you can merely load the font from the library at runtime and then you can use it anywhere.

You can also import multiple fonts at compile time and use them in the same textfield with the use of < class span="someCSSClass">Some Text < /span>< class span="someOtherCSSClass">Some Other Text < /span>

Good luck and I hope this helps. For the best tutorials check out Lee Brimelow at http://www.gotoandlearn.com and http://theflashblog.com

<3AS3

Answer 3

Holy cow just had the same problem. Apparently the order in which you set the variables matters. Look a the sixth reply on this thread. I also noticed that this only occurs with AntiAliasType.ADVANCED, which is the default on a TextField.

_description = new TextField();
_description.selectable = false;
_description.width = WIDTH; // Global.
addChild(_description);

var myriadPro:Font = new MyriadPro(); // Embedded font.
var style:StyleSheet = new StyleSheet();

var styleObj:Object = new Object();
styleObj.fontFamily = myriadPro.fontName;
styleObj.fontSize   = 13;
styleObj.textAlign  = "left";
styleObj.color      = "#FFFFFF";

style.setStyle("p", styleObj);
style.setStyle("a:link", styleObj);
style.setStyle("a:hover", styleObj);

_description.autoSize = TextFieldAutoSize.LEFT;
_description.antiAliasType = AntiAliasType.ADVANCED;
_description.condenseWhite = true;
_description.wordWrap   = true;
_description.multiline  = true;
_description.embedFonts = true;

_description.styleSheet = style;
_description.htmlText = '<p>A short description with an <a href="http://www.example.com/"&gt;HTML&lt;/a&gt; link that can be clicked.</p>';

Answer 4

I was having this issue also and found setting the following fixed it for me.

yourTextField.gridFitType = GridFitType.SUBPIXEL;

It looks as though it might be caused by when the AntiAliasType is set to advanced which defaults to a PIXEL gridFitType. I presume its shifting some of the copy as its trying to fix the characters to whole pixel values.

Answer 5

I tried all the above, but found making sure autosize = false was what fixed it for me.