Ciao a tutti,

sto realizzando una semplice interfaccia grafica per un segnapunti. La grafica prevede tre colonne, di cui le due laterali dedicate ai risultati delle due squadre, e la centrale al risultato e timer.

In basso vorrei fissare tre pulsanti, uno per ciascuna colonna, facendo in modo che i div "tabellone_squadra" si espandano il più possibile fino a fine pagina.

E' proprio questo che non riesco a fare, perché con il codice che ho realizzato fino a questo punto, i miei div "tabellone_squadra" non sono dinamici, ma hanno una lunghezza fissa.

Qualcuno mi può aiutare?

Di seguito il frammento di codice e relativo file css:
codice:
<divclass="score-board">            <div class="left_col" style="background-color: green;">
                <div class="logo_squadra">
                    <img src="images/logo_foosball.png"/>
                </div>
                <div class="tabellone_squadra">Tabellone squadra 1</div>
                <div class="pulsante_small">
                    <button type="button">Pulsante B</button>
                </div>
            </div>
            <div class="center_col" style="background-color: yellow;">
                <div class="punteggio">1 - 1</div>
                <div class="timer">00:00</div>
                <div id="pulsanteA">
                    <button type="button">Pulsante A</button>
                </div>
            </div>
            <div class="right_col" style="background-color: red;">
                <div class="logo_squadra">
                    <img src="images/logo_foosball.png"/>
                </div>
                <div class="tabellone_squadra">Tabellone squadra 2</div>
                <div class="pulsante_small">
                        <button type="button">Pulsante C</button>
                </div>
            </div>

</div>
codice:
.score-board {            text-align: center;
            padding: 25px;
        }
        .left_col {
            float: left;
            width: 33%;
        }
        .right_col {
            float: right;
            width: 33%;
        }
        .center_col {
            display: inline-block;
            width: 33%;
        }
        .logo_squadra img {
            width: 30%;
            height: auto;
            padding-top: 5%;
            padding-bottom: 5%;
        }
        .tabellone_squadra {
            display: inline-block;
            width: 90%;
            height: 150px;
            background-color: aquamarine;
            overflow: scroll;
        }
        .pulsante_small {
            padding-top: 5%;
            padding-bottom: 5%;
        }
        .punteggio {
            padding-top: 5%;
            padding-bottom: 5%;
            font-size: 600%;
        }
        .timer {
            font-size: 200%;

        }
Grazie e ciao,
Francesco