Blazor에서 버튼을 어떻게 가운데 정렬하나요?

🌐 ASP.NET, Blazor, IIS, 웹 Q&A
1 
@page "/"

<PageTitle>숫자 뽑기</PageTitle>

<p>최소값: <input @bind="MinValue" type="number"></p>
<p>최대값: <input @bind="MaxValue" type="number"></p>

<button style="width: 500px;" class="btn btn-primary" @onclick="Draw">뽑기</button>

<p><span style="font-size: 32pt;" class="d-flex justify-content-center">@Value</span></p>

@code {
    private int MinValue { get; set; }
    private int MaxValue { get; set; }
    private int? Value { get; set; } = null;

    private void Draw() {
        Value = Random.Shared.Next(MinValue, MaxValue + 1);
    }
}

Blazor로 간단한 숫자 뽑기 프로그램을 만들고 있습니다. 저 버튼을 가운데로 정렬하고 싶은데 방법을 모르겠네요. align: center도 해보고 d-flex justify-content-center도 해봤는데 안되네요.

1개의 좋아요
2

일단 inline style을 사용하신다면

<div style="text-align:center">
	<button style="width: 500px;" class="btn btn-primary" @onclick="Draw">뽑기</button>
</div>
2개의 좋아요
3

감사합니다. text-align을 써야 하는군요.

1개의 좋아요
4

가운데 정렬에 대한 CSS를 더 알아보고 싶으시다면 이 글을 보시는 것을 추천드립니다!

3개의 좋아요
5

와우. 정말 좋은 글입니다.
혹시, 서말인 구슬 꾀어 보실 생각을 없으신지요?

좋은 글에 대한 링크도 좋고, 직접 작성하신 글도 좋으니, 슬로그 한 번 만들어 주시면 정말 감사하겠습니다.

1개의 좋아요