Div affiancati

[Favozza]

Esiste qualche modo per creare div affiancati senza usare float?
Usando float, capita sempre che si frega qualcosa che ci stà dopo o prima :/

[sandrone65]

I div sono elementi di tipo block, quindi per default si posizionano uno sotto l'altro.
Per affiancare due o più DIV ci sono tre modi:

1) Li dichiari elementi inline

.miodiv{display:inline;}

Così facendo perdi però la possibilità di impostare diverse proprietà, come width, margin ecc.

2) Usi il posizionamento assoluto

.miodiv{position:absolute;top:0px;left;10px;}

In questo caso devi tener conto del fatto che i tuoi div sono fuori del flusso della pagina ma si posizioneranno in base alle loro proprietà top e left relativamente al loro primo contenitore padre non static. In pratica puoi definire per loro un contenitore ed impostargli position:relative.

3) Usi il float che rimane nella maggior parte dei casi la soluzione migliore. Non si "frega nulla", tranquillo occhio solo alla compatibilità con i vecchi browser.
Ciao

[Favozza]

nel caso metta un immagine in un div float questo nn si prende tutto lo spazio che occupa l'immagine ma rimane piccolo, così come se mette due div float in un div normale quest'ultimo rimane piccolo :/

[sandrone65]

Questi aspetti dipendono troppo dal contesto per poterne discutere in generale. Dovresti mostrare un esempio del problema che hai.
Tieni presente che i float vengono universalmente utilizzati senza grossi problemi, magari ti è sufficiente una piccola dritta per aggiustare un tuo particolare problema, ma... occorre un esempio.
Ciao

[sandrone65]

Aspetta, forse ho capito meglio ciò che intendevi: il float sposta un elemento dal flusso normale del documento, quindi è normale che le dimensioni del contenitore non siano influenzate (rimane piccolo).
Ti basta utilizzare il clear e risolvi tutto. Ad esempio, se inserisci un'immagine float in un contenitore puoi aggiungere dopo di essa:

<div style="clear:both;"></div>

e vedrai che il contenitore assumerà le dimensioni che ti aspetti.
Ciao

[Saveh]

come dice sandrone65 o usi il float e l'istruzione clear oppure crei 2 div di cui uno con posizione relative e l'altro con posizione assoluta, ovviamente quello con posizione assoluta deve stare dentro quello con posizione relativa, da li lo posizioni dove vuoi con top, left, bottom, right

[Favozza]

grazie delle risposte :P

[fcaldera]

oppure usi anche display : inline-block se non devi supportare anche IE6 o IE7