Первые три поля не выровнены с другими

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

У меня есть кодовая ручка пример.

Код для одного из проблемных полей:

<div class = "form-group">
     <label for = "inputRECE_DES" class = "col-sm-2 control-label">Stranka:*</label>
     <div class = "col-sm-3">
         <input type = "text" id = "inputACCO_NME" name = "cACCO_NME" class = "form-control" placeholder = "@iLocalization._iTTmvc(Context, "#Enter few letters of client or VAT#")" value = "@Model.cACCO_NME" />
     </div>
      <input type = "hidden" id = "hidden_iACCO_KEY" name = "iACCO_KEY" readonly = "readonly" value = "@Model.iACCO_KEY" />
</div>

html css twitter-bootstrap-3

31.01.2019 01:27

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Введение в CSS

CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.

Как выровнять Div по центру?

Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...

Навигация по приложениям React: Исчерпывающее руководство по React Router

React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

Toor - Ангулярный шаблон для бронирования путешествий

Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Элементы (в вашем коде кода) имеют разные значения padding из-за того, что к ним применяются разные классы, что приводит к разным расстояниям/ширинам. Используйте общий класс для всех похожих элементов и узкоспециализированный селектор CSS, чтобы перезаписать эти настройки общими настройками отступов.

31.01.2019 01:42

Ответ принят как подходящий

Похоже, вам просто не хватало закрывающего тега DIV form-group для вашей строки Kontact до исправления:

<link rel = "stylesheet" href = "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<form class = "form-horizontal do-not-submit" role = "form" id = "formJERECEProperties">
  <input type = "hidden" id = "iRECE_KEY" name = "iRECE_KEY" value = "180001334">
  <input type = "hidden" id = "hidden_cRECE_SRT" name = "cRECE_SRT" value = "6">
  <input type = "hidden" name = "iENTE_KEY" value = "110000007">
  <input type = "hidden" name = "iBUUN_KEY">

  <br>
  <h3>testing</h3>

  <div class = "row">
    <div class = "col-sm-12">
      <div class = "panel panel-default">
        <div class = "panel-heading">
          <h3 class = "panel-title">Testing</h3>
        </div>
        <div class = "panel-body">
          <div class = "form-group">

            <label for = "inputRECE_DBO" class = "col-sm-2 control-label">Datum izposoje:</label>
            <div class = "col-sm-2">
              <input type = "text" class = "form-control datepickerFiduro" name = "b53b663f-86cb-422c-9b2a-a407990788e5" id = "inputRECE_DBO" data-editable = "1" data-default = "true" value = "08.03.2018" name1 = "dRECE_DBO">
            </div>

            <label for = "inputRECE_DRE" class = "col-sm-2 control-label">Datum vračila:</label>
            <div class = "col-sm-2">
              <input type = "text" class = "form-control datepickerFiduro" name = "a41fa57c-4654-4f13-a5eb-c4abb56a5950" id = "inputRECE_DRE" data-editable = "1" data-default = "true" value = "09.03.2018" name1 = "dRECE_DRE">
            </div>


          </div>


          <div class = "form-group">
            <label for = "inputRECE_DES" class = "col-sm-2 control-label">Stranka:*</label>
            <div class = "col-sm-3">
              <span role = "status" aria-live = "polite" class = "ui-helper-hidden-accessible"></span><input type = "text" id = "inputACCO_NME" name = "98a4e8a7-55cb-4ab7-b075-7ab426566f5b" class = "form-control ui-autocomplete-input" placeholder = "Vpišite nekaj črk partnerja ali IDDDV"
                value = "" autocomplete = "off" name1 = "cACCO_NME">
            </div>
            <input type = "hidden" id = "hidden_iACCO_KEY" name = "iACCO_KEY" readonly = "readonly" value = "170000209" tabindex = "-1">
          </div>
          <div class = "form-group">
            <label for = "selectCONT_KEY" class = "col-sm-2 control-label">Kontakt:</label>
            <div class = "col-sm-3">
              <select id = "selectCONT_KEY" class = "form-control">

              </select><input type = "hidden" id = "hidden_iCONT_KEY" name = "iCONT_KEY">
            </div>
          </div>
          <div class = "clearfix"></div>
          <div class = "form-group col-sm-12"></div>
          <div class = "form-group">
            <label for = "inputRECE_NME" class = "col-sm-2 control-label">Ime reverza:</label>
            <div class = "col-sm-7">
              <input type = "text" class = "form-control" name = "ead8d066-2618-4ed2-b03e-84c6cb46da4d" id = "inputRECE_NME" value = "" name1 = "cRECE_NME">
            </div>
          </div>

          <div class = "form-group">
            <label class = "col-sm-2 control-label">Skladišče:</label>
            <div class = "col-sm-3">
              <select id = "inputDIVI_KEY" name = "iDIVI_KEY" class = "form-control">
                <option value = "140001070">Centralno skladišče</option>
              </select>
            </div>
            <div class = "col-sm-7"> </div>
          </div>



          <div class = "form-group">
            <label for = "inputRECE_TEL" class = "col-sm-2 control-label">Telefon:</label>
            <div class = "col-sm-4">
              <input type = "text" class = "form-control" name = "4c40d2be-7f87-4faf-a6ba-0ff9b95be11b" id = "inputRECE_TEL" value = "" name1 = "cRECE_TEL">
            </div>
            <label for = "inputRECE_MOB" class = "col-sm-1 control-label">Mobilni tel.:</label>
            <div class = "col-sm-4">
              <input type = "text" class = "form-control" name = "958d73bd-723b-4234-b625-1927e9cab407" id = "inputRECE_MOB" value = "" name1 = "cRECE_MOB">
            </div>
            <div class = "col-sm-1">
            </div>

          </div>
          <div class = "form-group">
            <label for = "inputRECE_EML" class = "col-sm-2 control-label">E-pošta:</label>
            <div class = "col-sm-5">
              <input type = "text" class = "form-control" name = "4f653c8e-5613-449c-9b85-6850c8c857d7" id = "inputRECE_EML" value = "" name1 = "cRECE_EML">
            </div>
            <div class = "col-sm-5">
            </div>

          </div>

          <div class = "form-group">
            <label for = "inputRECE_NTO" class = "col-sm-2 control-label">Opomba:</label>
            <div class = "col-sm-7">
              <textarea class = "form-control" id = "inputRECE_NTO" name = "cRECE_NTO">Prevzel je:

2 kom line
2 kom corner</textarea>
            </div>

            <div class = "col-sm-3">
            </div>
          </div>


          <div class = "form-group">
            <label for = "selectRECE_STA" class = "col-sm-2 control-label">Status:</label>
            <div class = "col-sm-2">
              <select id = "selectRECE_STA" name = "cRECE_STA" class = "form-control">
                <option value = "A" selected = "">Osnutek</option>
                <option value = "B">Izdan</option>
                <option value = "9">Izbrisan</option>
              </select>
            </div>


            <div class = "col-sm-8">
            </div>

          </div>






        </div>

        <div class = "clearfix"></div>
        <div class = "panel-body">
        </div>

      </div>
    </div>
  </div>



  </div>
</form>

Как ты нашла это так быстро? Есть ли какой-нибудь инструмент для этого?

— 31.01.2019 02:19

Нет, я просто сравнивал код между двумя строками, которые выравнивались по-разному, чтобы увидеть, есть ли различия в том, как они были отформатированы и т. д., и я заметил, что не было закрывающего div прямо там, где меняется выравнивание.

— 31.01.2019 03:25

31.01.2019 01:51