Floating un elemento in linea a destra di un div

Desidero allineare a destra un elemento in linea a destra di un div. Ho visto float = "right" applicato su una span per allineare a destra ma sembra semanticamente scorretto perché i float dovrebbero muovere "scatole" o bloccare gli elementi a destra oa sinistra di un elemento contenitore.Floating un elemento in linea a destra di un div

La mia comprensione di Float è errata o esiste un altro modo per allineare correttamente gli elementi in linea in un contenitore DIV.

fonte

2010-03-12 Rajat

Un altro problema che utilizzo Float su Span è che utilizziamo float: direttamente su span senza specificare una larghezza che va di nuovo contro i requisiti di un Float. Fondamentalmente, voglio utilizzare la proprietà di allungamento di un elemento in linea poiché prende la larghezza del contenuto che nel mio caso è dinamico. Convertirlo in un DIV perde questo vantaggio. – Rajat

Il floating di un elemento lo trasforma automaticamente in una scatola. (Vedi: http://css.maxdesign.com.au/floatutorial/introduction.htm) Tuttavia, non c'è nulla di semanticamente scorretto. Le semantiche non dettano ciò che dovrebbe essere visualizzato come un blocco e ciò che dovrebbe essere visualizzato in linea - questo è uno dei motivi per cui possiamo dichiararlo arbitrariamente. (Sicuramente diventa disordinato quando inizi a togliere le parole dal loro ordine - ma dubito che sia di questo che stai parlando, dato che non riesco a immaginare un caso quando vorrai farlo e che rimanga in linea.)

Inoltre, se è necessario per allineare un po 'di testo in linea indipendente dal flusso del testo normale (che è ciò che un galleggiante fa), si vuole veramente per visualizzarla come un blocco in ogni caso. Se è davvero un elemento in linea, tutto ciò che serve è text-align:right - tutto ciò di cui hai bisogno di un float o una posizione dichiarata su di te sta già trattando come un elemento di blocco, quindi non c'è niente di sbagliato nel dichiararlo come tale.

fonte

2010-03-12 02:29:48

ma non si consiglia l'uso di Float senza larghezza e in questo voglio che la mia larghezza sia = il contenuto e quindi l'elemento in linea? Quindi, se il mio elemento è un elemento di blocco con Float, non farebbe male la larghezza specificata? – Rajat

@Rajat Non avendo la larghezza specificata significa che di default il tuo float si ridurrà alla dimensione della parola più lunga. Puoi usare white-space: nowrap per sovrascrivere quel comportamento - quindi sarà ampio quanto il tuo contenuto. (Assicurati di inserire un BR se ne hai bisogno per completare.) –

float: right è perfettamente adatto a tutti gli elementi, a livello di blocco o in linea non importa, semanticamente o secondo le specifiche (per quanto ne so).

Se si desidera qualcosa di giusto-align senza utilizzare float poi c'è la possibilità di margin-right: 90%; (supponendo che si sa che cosa si tratta allineato a destra da/contro si inserisce l'altro 10%.

O direction: rtl; ma che mai funziona come penso che dovrebbe, inoltre potrebbe complicare le cose.

position: absolute; right: 0; farebbe come è necessario (ma sarebbe rimosso dal flusso del documento, e sarebbe posizionato contro il primo dei suoi elementi padre che ha un numero definito position: relative; (o almeno definito position).

Si potrebbe, eventualmente, utilizzare text-align: right, ma sembra una soluzione così semplice che sono sicuro che avrete già provato.

Se è possibile fornire un caso d'uso, un codice e un'indicazione del risultato finale atteso, potremmo essere in grado di aiutarvi di più.

fonte

2010-03-12 02:18:21

Floating un elemento in linea a destra di un div

risposta

Problemi correlati