css - ASP Styling isn't working properly -


i'm working on asp site company work at. it's adding money saving or earning activities overview 1 of directors can at.

currently though have styling issues, using bootstrap here.

enter image description here

i believe used have issue once how solved escapes me. can't center elements , can't make input boxes connect addons on right side seen in picture.

<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 activity. 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 activity. name appears in 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 activity. go-to person questions, progress , reports.">                             <b>?</b>                         </span>                     </div>                     <!-- todo: find automatic way make 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 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 activity. 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 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 thorough description explaining 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 activity.                                                multiple accounts can added separated commas.">                             <b>?</b>                         </span>                     </div>                     <div class="input-group">                         <span class="input-group-addon">upload estimation calculations activity.</span>                     </div>                 </div>             </div>         </div>     </div> </div> 

i feel html normal have hard time applying styles css files in asp in first place.

how make addons on right side connect input fields?

update

it appears problem inside default generated file called site.css. had following in it:

input, select, textarea {     max-width: 280px; } 

commenting out solves problem.

there must elsewhere on page breaking style of select boxes, because when view snippet in codepen, in both chrome , ie11, select boxes stretch question mark boxes @ right:

codepen.io/anon/pen/pgvoqg

btw, inline styles should avoided possible


Comments

Popular posts from this blog

php - Wordpress website dashboard page or post editor content is not showing but front end data is showing properly -

How to get the ip address of VM and use it to configure SSH connection dynamically in Ansible -

javascript - Get parameter of GET request -