In CSS overflow:hidden
è impostato sui contenitori padre per consentirne l'espansione con l'altezza dei loro figli fluttuanti.
Ma ha anche un'altra caratteristica interessante se combinato con margin: auto
...
Se il fratello PRECEDENTE è un elemento fluttuante, apparirà effettivamente giustapposto ad esso. Cioè, se il fratello è, float:left
il contenitore con float:none overflow:hidden
apparirà a destra del fratello, senza una nuova riga, proprio come se fluttuasse nel flusso normale. Se il fratello precedente lo è, float:right
il contenitore apparirà a sinistra del fratello. Il ridimensionamento di questo contenitore lo mostrerà accuratamente centrato tra gli elementi mobili. Supponiamo che se hai due fratelli precedenti, uno float:left
sull'altro float:right
, il contenitore apparirà centrato tra i due.
Quindi ecco il problema ...
Come mantengo quel tipo di layout SENZA mascherare i bambini?
Googling in tutto il Web mi dà modi su come clear:both
ed espandere un contenitore ... ma non riesco a trovare alcuna soluzione alternativa per mantenere la centratura sinistra / destra del bambino precedente. Se crei il contenitore, overflow:visible
il contenitore ignora improvvisamente il flusso di layout degli elementi fluttuanti e appare stratificato sopra l'elemento fluttuante.
Quindi domanda :
Devo avere il contenitore overflow:hidden
per preservare il layout ...
come posso fare in modo che i bambini non siano mascherati? Ho bisogno che il bambino sia assolutamente posizionato rispetto al genitore fuori dal contenitore.
O
Come faccio in overflow:visible
modo da poter assolutamente posizionare un figlio rispetto al genitore fuori dal contenitore ... ANCORA preservare il flusso di layout simile a un galleggiante fratello?