5
respostas

2 ou 3 fieldset option na mesma linha

Como faço para colocar 2 ou mais fieldset option na mesma linha? não estou conseguindo.

5 respostas

Olá João, tudo bem?

De acordo com sua dúvida, em como botar 2 ou mais fieldset em mesma linha, deu uma pensada e pesquisada e montei um exemplo abaixo, veja se é o que precisa e se o ajuda:

<!DOCTYPE html>
<html>
<body>

<style type="text/css">
    .container {
    height:100px;
    width:600px;      
}
.left {
    float:left;
    width:290px;
}
.right {
    float:right;
    width:300px;
    margin-left: 10px;
}
</style>

<h1>The fieldset element</h1>

<form action="/action_page.php">

<div class="container">
  <div class="left">
    <fieldset>
      <legend>Campos 01:</legend>
      <label for="fname">First name:</label>
      <input type="text" id="fname" name="fname"><br><br>
      <label for="lname">Last name:</label>
      <input type="text" id="lname" name="lname"><br><br>
    </fieldset>
  </div>

  <div class="right">
    <fieldset>
      <legend>Campos 02:</legend>
      <label for="email">Email:</label>
      <input type="email" id="email" name="email"><br><br>
      <label for="birthday">Birthday:</label>
      <input type="date" id="birthday" name="birthday"><br><br>
    </fieldset>
  </div>
</div>

</form>
</body>
</html>

Atenciosamente, Leandro de Azevedo.

Depois nos diga se esta certo o que estava querendo fazer em front end.

Deu certo, mas tive que adicionar esse ajuste para ficaram alinhados na mesma altura.

fieldset{ display: inline-block; position: absolute; }

Obrigado!

Ok, abraços.

Por favor João, não se esqueça de dar seu voto final para a resposta, abraços.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software