Geek asks and answers

Floats and horizontal fields

I have the following CSS:

label{
    float:left;
    margin-left:24px;
}

button{
    margin-left:24px;
}

for this HTML:

<label>
    <input>
</label>
<button>

and I was hoping that the button was found at a distance of 24 pixels of the label, however this did not happen until I left the button on the left. What part of the CSS specification can I refer to to understand why this is happening?

(Sorry, my English.)

+3
source share
3 answers

Sorry for my previous answer, which I hope has been deleted.

Fields are complex. In this case, the fields are not taken into account in the floats: they are calculated from the place where the element is started if the float was not there. Perhaps you can apply margin-right to the float, or if you know that the width of the float adds it plus its margin to the value you want to split.

0

W3C float:

, :

  • . .
  • , - , , , , . .
  • - , . .
  • , . , , , . .
  • .
  • , , , .
  • - . (: , .) .
  • .
  • , .. , /.

, margin. <label> , , , , inline-block, margin.

. display: inline-block; float: left; , .

+1

A training created by the W3C consortium can help you.

And a specification with all the theory associated with this field: Visual formatting model

0
source

More articles:


All Articles