Как добавить отступ между кнопками? - PullRequest
Новая
       14

Как добавить отступ между кнопками?

0 голосов
/ 23 мая 2018

У меня есть asp:Panel, который содержит динамически добавленные пользовательские адресные кнопки.То, что я пытаюсь сделать, это добавить CssClass ко 2-й, 3-й и n-й кнопкам , если их несколько .Я хочу, чтобы первая кнопка оставалась на месте, а все последующие кнопки - чтобы получить класс CssClass, который просто добавляет небольшое количество отступов к левой стороне, но только если они не являются первой кнопкой.

Вот мой псевдо-код для того, что я пытаюсь сделать: 

if (user.address.Count > 1)
{
    foreach (UserAddress ua in user.addresses)
    {
        // Where the buttons are not the first button
        btnAddress.CssClass += " AddressButtonSpacing";
    }
}

Это часть Где, с которой у меня возникают проблемы, я не знаю, как это написать.Как мне написать «Для каждой кнопки на этой панели, которая не является первой, добавьте этот класс CssClass»?

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

Я также использую Bootstrap и попытался установить их на панели: 

display: flex;
justify-content: space-between;

потому что space-between это именно то, что я ищу, но это не сработало (я думаю, потому что это панель, а не div?) Либо это, либо space-between работает только на divа не кнопки, идк.И да, я знаю, что панель отображается как div, но она все еще не работает, поэтому я пробую другие вещи.

После панели есть небольшой разделитель, за которым следует другой набор (статических) кнопок:

мои адресные кнопки

Все, что мне нужно, это небольшой промежуток между этими кнопками и только между ними.

У кого-нибудь есть предложения?

1 Ответ

0 голосов
/ 23 мая 2018

Вы можете использовать CSS-селекторы для этого. 

<asp:Panel ID="Panel1" runat="server" CssClass="ButtonContainer">
    <asp:Button ID="Button1" runat="server" Text="Button" />
    <asp:Button ID="Button2" runat="server" Text="Button" />
    <asp:Button ID="Button3" runat="server" Text="Button" />
</asp:Panel>

<style>
    .ButtonContainer input:not(:first-child) {
        background-color: #ff0000;
        margin-left: 25px;
    }
</style>

Yoy всегда может сделать простое margin-right, если вы не возражаете против дополнительного пробела после 1234 North Street

...