Alignment of Text to Input

Asked

Viewed 47 times

1

Good evening, everyone, I hope you’re all right.

I’m having trouble aligning Text on top of Input.

HTML

<div class="form-group2 col-md-4">
              <label for="inputState">Estado</label>
              <select id="inputState"
              type="text"
              class="form-control">

CSS

#inputState {
padding: auto;
margin: 78px;
margin-top: auto;
width: 245px;

A sample picture of what I’m trying to do

inserir a descrição da imagem aqui

I would be very grateful if someone could help me, and I apologize in advance for any such questions "common"

OBS: Code with gambiarra maybe, do not judge, no one born knowing. = D

html css input label scss

1 answer

-1


From what I understand, what you want are two Fields input side by side on the same line. I used bootstrap 4. You can remove the added css. Because bootstrap already handles the type of alignment you want.

Here is an example of how to do the desired alignment:

<!doctype html>

<html lang="en">

<head>
  <meta charset="utf-8">

  <title>HTML5</title>
  <meta name="description" content="HTML5">

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

</head>

<body>
  <form>
    <div class="row">
      <div class="col">
        <div class="form-group">
          <label for="inputState">Estado</label>
          <select id="inputState" type="text" class="form-control"></select>
        </div>
      </div>
      <div class="col">
        <div class="form-group">
          <label>Endereco</label>
          <input type="text" class="form-control" placeholder="Rua número e bairro">
        </div>
      </div>
    </div>
  </form>
</body>

</html>

  • It didn’t work out for me :(

  • Managed to run this example?

  • Yes, but still not aligned in the right way :/, I think I will redo all the HTML same..

Browser other questions tagged html css input label scss

You are not signed in. Login or sign up in order to post.