Блог

Я использую плагин jQuerytokenInput, и у меня есть элемент ввода с фиксированной шириной. CSS для элемента ввода выглядит следующим образом:

 li.token-input-input-token-mac input {
  width: 100px;
  padding: 3px;
  margin: 0;
  border: none;
}
 

Это дает ширину ввода 100 пикселей. Однако я хочу, чтобы ширина была как можно меньше, когда ввода нет, и увеличивалась в зависимости от ввода. Как мне добиться такого поведения?

Попробуйте что-то вроде этого.

  li.token-input-input-token-mac input {
  width: 0px;
  max-width: 100px;
  padding: 3px;
  margin: 0;
  border: none;

}
 

Демонстрационный Jsfiddle

 .something {
  width: 100px;
  padding: 3px;
  margin: 0;
  border: none;
  background: green;

}
.nothing {
  width: 0px;
  max-width: 100px;
  padding: 3px;
  margin: 0;
  border: none;
  background: green;
} 

     <div class="something">
    1234
    </div>
    <br>
    <div class="nothing">

    </div>