Comment faire pour que l'effondrement des marges fonctionne avec le type d'entrée = button/submit?

Tenir compte following code:Comment faire pour que l'effondrement des marges fonctionne avec le type d'entrée = button/submit?

<p style="margin: 30px 0; padding: 0;">Some text some text some text some text some 
text some text some text some text</p> 

<p style="margin: 30px 0; padding: 0;">Some text some text some text some text some 
text some text some text some text</p> 

<input type="button" value="Button" style="margin: 30px 0; padding: 0; float: right;"/>

30px marge attendue entre le dernier p et input mais il y a marge 60px. Apparemment, la marge s'effondrer ne fonctionne pas. Comment corriger les règles CSS de input tout en gardant la possibilité de input de produire 30px marge verticale sur le dessus?

Source

2010-10-17 actual

Essayez le réglage display:block sur le input

EDIT: Il suffit de jeter un emballage autour d'elle alors?

http://jsfiddle.net/8mqHZ/13/

Source

2010-10-17 07:11:35

Chose étrange, dans l'exemple de code, cela aide, en production ce n'est pas le cas. Essayer d'isoler la cause ... – actual

Aha, isolé, la cause est 'float: right' (code mis à jour). Comment garder le flot droit et ne pas avoir une double marge? – actual

@actuel Eh bien, l'effondrement de la marge, si je me souviens bien, ne s'applique pas aux éléments flottants. Il pourrait être préférable de simplement définir le 30px d'un côté. –

La seule solution que j'ai trouvé:

<div style="text-align: right; margin: 30px 0;"> 
    <input type="button" value="Button" /> 
</div>

Un peu de hack.

Source

2010-10-17 07:58:25 actual

Comment faire pour que l'effondrement des marges fonctionne avec le type d'entrée = button/submit?

Répondre

Questions connexes