javascript - 对齐文本插件 bootstrap html

Question

我正在尝试使用 Bootstrap 创建一个表单，但我无法让插件中的文本正确排列。我希望每个输入组的插件大小都相同。这是我的 html:

<div class="input-group"><span class="input-group-addon">Event Name</span><input type="text" class="form-control" placeholder="Ex. Bingo" id="event"></div>

<div class="input-group"><span class="input-group-addon">Mon</span><input type="text" class="form-control" placeholder="00:00" id="mon"></div>

<div class="input-group"><span class="input-group-addon">Tue</span><input type="text" class="form-control" placeholder="00:00" id="tues"></div>

<div class="input-group"><span class="input-group-addon">Wed</span><input type="text" class="form-control" placeholder="00:00" id="wed"></div>

<div class="input-group"><span class="input-group-addon">Thu</span><input type="text" class="form-control" placeholder="00:00" id="thurs"></div>

<div class="input-group"><span class="input-group-addon">Fri</span><input type="text" class="form-control" placeholder="00:00" id="fri"></div>

<div class="input-group"><span class="input-group-addon">Sat</span><input type="text" class="form-control" placeholder="00:00" id="sat"></div>

<div class="input-group"><span class="input-group-addon">Sun</span><input type="text" class="form-control" placeholder="00:00" id="sun"></div>

非常感谢任何帮助

Answer 1

如果你想让标签的宽度相同，你可以像这样添加到 css 类:

.input-group-addon {
    width: 150px;
}

JSFiddle:http://jsfiddle.net/biz79/j2m9ng9p/