Eu tenho o seguinte código:
<div style="float: left; width: 100%;">
<label style="float: left;">ABC</label>
<input style="float: left; font-size: 0.5em;" type="button" onclick="addTiny(0,'Question_Text'); return false;" value="▼" title="Editor" />
<input style="float: left; font-size: 0.5em;" type="button" onclick="remTiny(0,'Question_Text'); return false;" value="▲" title="Hide" />
<div class="adm">
<textarea rows="2;" style="width: 100%" class="text-box multi-line mceEditor">
abc
</textarea>
</div>
</div>
Meu problema é que o div com a classe adm flutua para a esquerda e segue na mesma linha que o rótulo e dois botões de entrada. Existe uma maneira de fazer essa mudança para longe da flutuação?
Respostas:
Uma abordagem padrão é adicionar um div de limpeza entre os dois elementos de nível de bloco flutuante:
fonte
display:block
Às vezes, o claro não funciona. Use
float: none
como uma substituiçãofonte
float: left
(ou direita), esta é a solução.Você pode modificar
.adm
e adicionarIsso deve fazer com que ele mude para uma nova linha
fonte
.adm
eu acho.adicione
style="clear:both;"
ao "adm"div
.fonte
Ok, acabei de perceber que a resposta é remover o primeiro flutuador à esquerda do primeiro DIV. Não sei por que não vi isso antes.
fonte
Você também deve verificar a propriedade "clear" no css caso a remoção de um float não seja uma opção
fonte
O css
clear: left
em sua classe adm deve impedir que o div flutue com os elementos acima dele.fonte
Basta adicionar
overflow:hidden
o primeirodiv
estilo. Isso deve ser o suficiente.fonte
Por algum motivo, nenhuma das correções acima funcionou para mim (eu tive o mesmo problema), mas isso funcionou:
Tente colocar todos os elementos flutuavam em um elemento div:
<div class="row">...</div>
.Em seguida, adicione este CCS:
.row::after {content: ""; clear: both; display: table;}
fonte