Skip to content

fix: Extra space on the left side of FluentAnchor with appearance Hypertext #3130

@haefele

Description

@haefele

🐛 Bug Report

There is some extra space on the left side of FluentAnchor when using Appearance.Hypertext.

💻 Repro or Code Sample

The problem happens on the docs page of the FluentAnchor component right in the first example here:
https://www.fluentui-blazor.net/Anchor

I took this example from the docs:

<p>With custom action</p>
<FluentAnchor Href="#" Appearance="Appearance.Hypertext" OnClick="HandleClick">Link with no Href</FluentAnchor>

🤔 Expected Behavior

The <p> element content, and the <FluentAnchor> content should be in line.
There shouldn't be any extra space when using Appearance.Hypertext.

😯 Current Behavior

I added a red line that shows the anchor is in line as a Button, but there is a bit of extra space with as Hypertext

Example current behavior

💁 Possible Solution

Not sure tbh. I'm not very good with CSS (which is why I like using this component library 😄).

But I think this problem was accidentally introduced in #2624 .

🔦 Context

🌍 Your Environment

  • OS & Device: Windows on PC
  • Browser: Microsoft Edge
  • .NET Version: 8.0.11
  • Fluent UI Blazor library Version: 4.10.2 and 4.11.0

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions