Como já foi dito o posicionamento feito com float tem regras diferentes. O box será retirado do lugar e ocupará a posição left ou right, dependendo do que foi estipulado à direita ou esquerda um ao lado do outro. Este posicionamento é usado para menu drop down. Exemplo:
Na folha de estilo ficaria assim:
li{
margin: 25px;/*separa um box de menu do outro*/
color:#990000;/*vermelho escuro*/
font-size: 24px;
font-style:italic;
float:left;
width:100px;
list-style:none;/*retira a marcação de lista. As bolinhas*/
border:2px dotted black;
padding-left: 30px; /*centraliza o texto dentro do box*/
}
bs; A ordem de flutuação será de acordo com a ordem escolhida em float.
<span class= "destaque">Para destacar uma frase dentro do texto.
Esta forma de destacar uma frase ou um texto, chama-se pool cot</span>
Na folha de estilo ficaria assim:
.destaque{
border: 1px dotted black;
position: relative;
background-color: #F5F5F5;
padding-left: 14px;
padding-top: 14px;
padding-bottom: 14px;
left: 6px;
top: 6px;
}
Na folha de estilo ficaria assim:
h2, h3, p{
border: 1px solid black;
width: 200px;
float:left;
}