使用css水平地隔开我的复选框？ [英] Horizontally space out my checkboxes using css?

问题描述

我有一个复选框列表，我想在一个水平线上分隔开。

I have a list of checkboxes that I'd like to have spaced out on a single horizontal line.

<div class="timesheet-daily-entry-fields-container">
        <input id="TimesheetMondayCheckbox" class="timesheet-daily-checkbox" type="checkbox"/>
        <input id="TimesheetTuesdayCheckbox" class="timesheet-daily-checkbox" type="checkbox"/>
        <input id="TimesheetWednesdayCheckbox" class="timesheet-daily-checkbox" type="checkbox"/>
        <input id="TimesheetThursdayCheckbox" class="timesheet-daily-checkbox" type="checkbox"/>
        <input id="TimesheetFridayCheckbox" class="timesheet-daily-checkbox" type="checkbox"/>
        <input id="TimesheetSaturdayCheckbox" class="timesheet-daily-checkbox" type="checkbox"/>
        <input id="TimesheetSundayCheckbox" class="timesheet-daily-checkbox" type="checkbox"/>
 </div>

他们显示在行上，但我想把它们分开。

They display on the line, but I'd like to space them out more.

.timesheet-daily-checkbox {
    margin: 10px;
    padding: 10px;
    display:inline-block;
    overflow:hidden
}

我不想创建一个div

I'd rather not create a div around each input, is there an easier way?

推荐答案

增加左右边距

margin: 10px 20px;

这篇关于使用css水平地隔开我的复选框？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！