Qual è il modo migliore per allineare a destra e allineare due tag div divisi su una pagina Web orizzontalmente uno accanto all'altro? Vorrei una soluzione elegante per farlo, se possibile.Qual è il modo migliore per allineare a sinistra e allineare a destra due tag div?
risposta
<div style="float: left;">Left Div</div>
<div style="float: right;">Right Div</div>
<style>
#div1, #div2 {
float: left; /* or right */
}
</style>
Come alternativa a variabile:
<style>
.wrapper{position:relative;}
.right,.left{width:50%; position:absolute;}
.right{right:0;}
.left{left:0;}
</style>
...
<div class="wrapper">
<div class="left"></div>
<div class="right"></div>
</div>
Considerando che non c'è alcuna necessità di posizionare il div .left come assoluto (a seconda della direzione, questo potrebbe essere quello .right a causa di ciò sarebbe nella posizione desiderata nel flusso naturale del codice html.
questa soluzione funziona anche con IE7 (la risposta accettata no: il div destro sarà floatato a destra ma anche 1 breakdown) – firepol
'.right, .left {width: 50%; display: inline-block} ' – sepehr
Se hai un div al di sotto del div wrapper, prenderà il posto del div wrapper, un effetto indesiderato. –
È possibile farlo con poche righe di codice CSS. È possibile allineare tutte le div che si desidera visualizzare l'una accanto all'altra a destra.
<div class="div_r">First Element</div>
<div class="div_r">Second Element</div>
<style>
.div_r{
float:right;
color:red;
}
</style>
uso imbottitura tag i tag galleggiare sopra non ha ancora lavorato fuori, ho usato
padding left:5px;
padding left :30px
ho usato la seguente. L'elemento del genere inizierà dove finisce l'elemento DJ,
<div>
<div style="width:50%; float:left">DJ</div>
<div>genre</div>
</div>
scusa il css in linea.
Questa soluzione ha lasciato il testo allineato e il pulsante all'estrema destra.
Se qualcuno è alla ricerca di una risposta disegno materiale:
<div layout="column" layout-align="start start">
<div layout="row" style="width:100%">
<div flex="grow">Left Aligned text</div>
<md-button aria-label="help" ng-click="showHelpDialog()">
<md-icon md-svg-icon="help"></md-icon>
</md-button>
</div>
</div>
è possibile utilizzare un tag principale div in questo modo:
<!doctype html>
<html>
<head>
<style>
.parent{
text-align:center;
}
.child{
width:45%;
display:inline-block;
border:1px solid #cccccc;
}
</style>
</head>
<body>
<div class="parent">
<div class="child">First Element</div>
<div class="child">Second Element</div>
</div>
</body>
</html>
- 1. Come allineare a destra e giustificare-allineare in Markdown?
- 2. Elemento ionico con testo allineato a sinistra e a destra
- 3. CSS: il modo migliore per allineare un float: sezione destra
- 4. Allineare valori filatore a destra invece che a sinistra
- 5. Allineare a sinistra un oggetto rotante panda
- 6. allineare il testo a destra in UIPickerView
- 7. Come posso allineare il testo a sinistra e il testo a destra nella stessa riga?
- 8. allineare le colonne del grafico sinistra/destra
- 9. Allineare il testo in JLabel a destra
- 10. Come allineare al centro un elemento flessibile e allineare a destra un altro usando Flexbox
- 11. Come allineare due elementi di span uno a sinistra, l'altro a destra?
- 12. Allineare una voce a sinistra di ActionBar
- 13. Come allineare a destra un div con display inline-block?
- 14. Come allineare due div orizzontalmente?
- 15. Come posso allineare l'input numerico a destra e l'immissione di testo a sinistra?
- 16. Come allineare a destra il div di posizione fissa all'interno di un div
- 17. Allinea due span all'interno di un td - Uno a sinistra e uno a destra
- 18. CSS: ruotare l'immagine e allineare in alto a sinistra
- 19. Come allineare verticalmente due div flottanti?
- 20. È possibile allineare due DIV affiancati se uno è fisso?
- 21. Allineamento a sinistra e allineamento a destra all'interno di div in Bootstrap
- 22. Come allineare elementi in una barra degli strumenti a sinistra, a metà, a destra
- 23. Come ottenere un TextBlock per allineare a destra?
- 24. Allineare due testi UILabel
- 25. Come allineare a destra e allineare le stringhe di testo in Bash
- 26. Utilizzando materiale angolare, è possibile allineare un pulsante a sinistra e un altro a destra, nella stessa riga?
- 27. Come a sinistra allineare il testo in Annota da ggplot2
- 28. Come allineare a destra il contenuto in un DataTemplate?
- 29. Come posso galleggiare due div a sinistra (sotto l'altro) e due div di destra (sotto l'altro)
- 30. bisogno div interno per allineare in alto in contenitore div
Eventuali duplicati di [Qual è il modo migliore per allineare due in linea estendi gli elementi a sinistra e a destra senza float?] (http://stackoverflow.com/questions/41951530/questo-è-il-best-way-to-align-two-inline-span-elements-to-left-and -right-without) –