Mettili al 49% (o quanto serve per mantenerli sulla stessa linea e avere lo spazio in mezzo) quindi imposta float:right per quello a destra.
Mettili al 49% (o quanto serve per mantenerli sulla stessa linea e avere lo spazio in mezzo) quindi imposta float:right per quello a destra.
Installa Forum HTML.it Toolset per una fruizione ottimale del Forum
Grazie mille, avevo pensato a questa soluzione come emergenza: se in futuro i bottoni dovessero diventare 3 o più...?Originariamente inviata da KillerWorm
Qui una soluzione con flex-box. La proprietà flex-grow ripartisce la larghezza dei vari elementi rispetto al contenitore. In questo caso, tutti avranno stessa larghezza. Inoltre ho impostato un margin di 4px per definire lo spazio tra gli elementi.
codice:<!DOCTYPE HTML> <html> <head> <title>Esempio</title> <meta charset="utf-8"> <style type="text/css"> .fit-width { width: 100%; display: flex; } .fit-width>* { flex-grow: 1; margin-right: 4px; } .fit-width>:first-child { margin-left: 4px; } </style> </head> <body> <div class="fit-width"> <button type="button">Bottone 1</button> <button type="button">Bottone 2</button> </div> <div class="fit-width"> <button type="button">Bottone 1</button> <button type="button">Bottone 2</button> <button type="button">Bottone 3</button> </div> <div class="fit-width"> <button type="button">Bottone 1</button> <button type="button">Bottone 2</button> <button type="button">Bottone 2</button> <button type="button">Bottone 4</button> </div> </body> </html>
Installa Forum HTML.it Toolset per una fruizione ottimale del Forum
Permessi di invio
Rispondi quotando