4

Eu tenho 2 input-group, eles estão "grudados", quero dar um espaço em branco, segue código abaixo:

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="panel panel-default">
  <div class="panel-heading">
  
    <div class="input-group" style="width:1px; float:left">
      <label class="input-group-btn">
        <span class="btn btn-primary" style="width:111px">
Teste1&hellip;
        </span>
      </label>
      <input type="text" style="background-color:white; width:239px;" class="form-control" value="Teste 1" readonly>
      <label class="input-group-btn" title="Teste 1">
        <span style="top:-0px" class="btn btn-danger glyphicon glyphicon-trash"></span>
      </label>
    </div>
    
    
    <div class="input-group" style="width:1px">
      <label class="input-group-btn">
        <span class="btn btn-primary" style="width:111px">
         Teste2&hellip;
        </span>
      </label>
      <input type="text" style="background-color:white; width:239px;" class="form-control" value="Teste 2" readonly>

      <label class="input-group-btn" title="Teste 2">
        <span style="top:-0px" class="btn btn-danger glyphicon glyphicon-trash"></span>
      </label>
    </div>

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

ou exemplo de JSFiddle

2 Respostas 2

2

Você pode definir uma margem para os input-group

.input-group {
    margin: 5px;
}
3
  • Oi @Rafael Acioly, nesse caso eu não quero mexer a altura dele. 19/12/2016 às 16:30
  • como assim mexer na altura? o margin apenas adiciona MARGENS no elemento; ou seja; 5px em cima, em baixo e dos lados.
    – RFL
    19/12/2016 às 16:32
  • Tem como só alterar pelo lado e não de cima e baixo ? 19/12/2016 às 16:32
2

Pode usa o br/, como outra alternativa.

<br/><br/>
<div class="input-group" style="width:1px">

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .