ASP样式没有正常工作

Question

我在我工作的公司的ASP网站上工作。它是关于增加省钱或赚钱活动的概述，其中一位董事可以看一下。

目前虽然我有一些样式问题，但在这里使用bootstrap。

我相信我曾经有过一次这个问题，但我是如何解决这个问题的。我无法将所有元素集中在一起，我无法使输入框与右侧的插件连接，如图所示。

let move<'a:IArtefact>(a : 'a) (path : string) =
    File.Move(a.File, path)
    { a with File = path }

我觉得我的HTML很正常，但我很难在ASP中使用CSS文件中的样式。

如何让右侧的插件与输入字段连接？

更新

问题似乎是在名为<div class="container body-content" style="padding-top: 15px;"> <div class="container" align="center"> <div class="col-lg-8"> <div class="row"> <h2>Abstract</h2> <div class="form-group"> <div class="input-group" style="padding-bottom: 10px;"> <span id="add-addon-styling" class="input-group-addon">FYE</span> <select class="form-control required" id="new-activity-fye-dropdown"> <option value="1">On Track</option> <option value="2">Issue</option> <option value="3">Behind</option> </select> <span class="input-group-addon" data-toggle="tooltip" data-placement="top" title="The Full Year Expectation of the Activity. Usually On Track on creation."> <b>?</b> </span> </div> <div class="input-group" style="padding-bottom: 10px;"> <span id="add-addon-styling" class="input-group-addon">Activity Name</span> <input type="text" class="form-control required" id="new-activity-modal-name-field" aria-describedby="new-activity-modal-name-field" /> <span class="input-group-addon" data-toggle="tooltip" data-placement="top" title="The Name of the Activity. This name appears in the Activity Overview."> <b>?</b> </span> </div> <div class="input-group" style="padding-bottom: 10px;"> <span id="add-addon-styling" class="input-group-addon">Responsible</span> <input type="text" class="form-control required" id="new-activity-modal-responsible-field" aria-describedby="new-activity-modal-responsible-field" disabled /> <span class="input-group-addon" data-toggle="tooltip" data-placement="top" title="The responsible person for this activity. This it the go-to person for questions, progress and reports."> <b>?</b> </span> </div> <!-- TODO: Find an automatic way to make this dropdown --> <div class="input-group" style="padding-bottom: 10px;"> <span id="add-addon-styling" class="input-group-addon">Department</span> <select class="form-control required" id="new-activity-modal-department-dropdown"> <!-- Handled in content-controller: CreateNewActivityDepartmentDropdown() --> </select> <span class="input-group-addon" data-toggle="tooltip" data-placement="top" title="The department this activity belongs to."> <b>?</b> </span> </div> <div class="input-group" style="padding-bottom: 10px;"> <span id="add-addon-styling" class="input-group-addon">Start Time</span> <input class="form-control" type="text" id="new-activity-modal-datepicker-start" /> <span class="input-group-addon" data-toggle="tooltip" data-placement="top" title="The start of the activity. Usually today's date."> <b>?</b> </span> </div> <div class="input-group" style="padding-bottom: 10px;"> <span id="add-addon-styling" class="input-group-addon">End Time</span> <input class="form-control" type="text" id="new-activity-modal-datepicker-end" /> <span class="input-group-addon" data-toggle="tooltip" data-placement="top" title="The estimated end of the activity."> <b>?</b> </span> </div> </div> </div> <div class="row"> <h2>Description</h2> <div class="form-group"> <div class="input-group"> <span class="input-group-addon">Upload a thorough description explaining the Activity.</span> </div> </div> </div> <div class="row"> <h2>Estimation</h2> <div class="form-group"> <div class="input-group" style="padding-bottom: 10px;"> <span id="add-addon-styling" class="input-group-addon">AX Account Number(s)</span> <input type="text" class="form-control required" id="new-activity-modal-ax-account-numbers-field" aria-describedby="new-activity-modal-ax-account-numbers-field" /> <span class="input-group-addon" data-toggle="tooltip" data-placement="top" title="AX Account number associated with the activity. Multiple accounts can be added separated by commas."> <b>?</b> </span> </div> <div class="input-group"> <span class="input-group-addon">Upload the estimation calculations for the Activity.</span> </div> </div> </div> </div> </div> </div> 的默认生成文件中。它包含以下内容：

Site.css

评论说明了解决问题。

Answer 1

由于我不知道ASP的css结构究竟是什么，所以我将如何处理这种情况：

使用浏览器的检查器确切地检查css规则的类型是什么？按钮一直向右，我只能假设它有浮动，或者表格右边有一个巨大的边距。

一旦你发现了这个问题，你可以进一步使用你的浏览器检查员来测试一些编辑，如果它是一个边缘的东西，看看它实际需要多少余量，如果它是一个浮动问题，看看它将如何看待浮动：无

一旦找到问题的解决方案，就需要应用它，为此添加一个自定义.css文件AFTER ASPs css文件，这样你写的任何东西都会覆盖任何现有的规则。

将修复程序添加到此新文件中，您应该完成。

Answer 2

页面上的其他地方必须有一些违反选择框样式的内容，因为当我在codepen中查看您的代码段时，在Chrome和IE11中，选择框会拉伸到右侧的问号框：

codepen.io/anon/pen/pgVoQg

顺便说一句，在可能的情况下，通常应该避免使用内联样式