How to move the input box

Asked

Viewed 67 times

0

I would like to just move the box (the box itself) from the input to the right of my div.

    <div id='mainBox'>
Distancia departure/arrival <input class='inputs'>
<p></p>
Distancia arrival/alternate <input class='inputs'>
<p></p>
Velocidade de cruzeiro <input class='inputs'>
<p></p>
Consumo da aeronave em litros <input class='inputs'>

</div>

Gostaria de jogar os campos de inserção de dados para a direita dessa box!

I’ve tried everything I can through margin and padding, but the inputs are all cluttered :/

  • If the answer is correct, don’t forget to evaluate.

2 answers

-1

A possible solution:

  • Give display labels: inline-block
  • Give them a fixed width
  • Align text to the right

label {
  display: inline-block;
  width: 140px;
  text-align: right;
}​
<div class="block">
    <label>Primeira Label</label>
    <input type="text" />
</div>
<div class="block">
    <label>Segunda Label</label>
    <input type="text" />
</div>
<div class="block">
    <label>Terceira Label</label>
    <input type="text" />
</div>

  • Thanks man! That was right!

  • @Lisandrobeltrã, if the solution is correct, do not forget to evaluate.

-2


What I understand is that you want to move the input to the right, if this is it, the following section will solve:

#mainBox input{
 float:right;
}

Guys the answer is correct, they gave down vote unnecessary here.

  • You can margin-right on "px" too if you don’t want it to be totally right.

  • Thanks! That’s just it! I learned one more :)

  • lol didn’t understand the downvotes '-'

  • Yeah, they gave unnecessary downvotes here :(

Browser other questions tagged

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