Возникли проблемы при изменении размера кнопки actionlink в mvc

Question

Кажется, я не могу изменить эту ссылку действия с помощью пользовательского CSS. Когда я использую bootstrap, он работает нормально. Но мне нужно добавить много обычаев к этому. Не уверен, что я здесь делаю не так.

HTML

@foreach (var item in Model) {                            
    <div id="yasin03" class="card">

        <div class="pull-right btnDelete">
            @Html.ActionLink(HttpUtility.HtmlDecode("&#x1F5D1;"), "Delete", new { id = item.BulletinId})
        </div>

        <div class="card-body">
            <h5 class="card-title">@Html.Raw(@item.BulletinCategoryEnum)</h5>
            <h6 class="card-subtitle mb-2 text-muted">@item.BulletinDate.ToString("MM-dd-yyyy")</h6>
            <p class="card-text">@Html.Raw(@item.BulletinBody)</p>
        </div>
    </div>
}

CSS:

.btnDelete {
    width: 40px;
}

Answer 1

Кнопка действительно не исчезает, но это поможет вам в вашей задаче заархивировать вашу цель, также отметьте https://www.w3schools.com/css/css3_buttons.asp Я надеюсь, это то, что вы ищете, иначе я не понял вопроса

.btnDelete {
    margin: 5px;
    background-color: black;
    color: orangered;
    border-radius: 2px;
}
.btnDelete:hover {
background-color: white;
color: white;
}

<div class="pull-right btnDelete">Button</div>

Answer 2

На css это не влияет, потому что вы устанавливаете ширину div, который окружает вашу кнопку. Чтобы ваша ссылка была 40px, добавьте ширину 100%, чтобы она заполняла div. Вы также можете дать ссылке уникальный идентификатор, или класс может быть проще внутри foreach, и установить его ширину 40px.