Responsive probleempje

Ik heb een klein probleempje met een tabel met waarin vier cirkels. Iedere cirkel staat in een eigen cel. Klik je op een cirkel dan zie je een andere kleur.
de pagina is optimaal voor een breedte van 1920 pixels. De website is responsive en bijna alles past zich keurig aan.
de cirkels helaas niet.
Ik zoek eigenlijk een oplossing om de tabel of de naast elkaar staande cirkels ook mee te laten schalen
website staat hier

Een tabel is NIET responsive.
Dat is nu eenmaal de eigenschap van een tabel.
Je kunt een tabel wel simuleren door de code hiervoor te bouwen met divs.
Een "tabel" opgebouwd uit divs schaalt namelijk wel netjes mee.

Bedankt, heb hier niet zoveel verstand van. Ik ga zoeken naar voorbeelden.

Misschien heb je hier wat aan:
Using the Div Tag to Create Tables .
Of anders dit topic hier op Joomla!NL over hetzelfde onderwerp.

Heel erg bedankt Woody voor de links.
Ik ben intussen een stuk verder door de voorbeelden die je gaf.
Nog een vraag, de circels heb ik mooi naast elkaar met een goede afstand tussen elkaar.
De tekst eronder is eigenlijk te breed waardoor deze doorloopt in de tekst van de volgende cirkel.
ben aan het stoeien geweest met marges maar kom er niet zo uit.
Misschien nog een tip.
Voorbeeld staat hier

Volgens mij kun je beter de cellen ook een class meegeven.
In je template.css vervolgens de definities van de opmaak plaatsen bijv:
Daarnaast zou ik de afbeelding in een foto-bewerkingsprogramma of iets dergelijks ook al vast op 200px zetten.
bij plaatsen in de cel dan vervolgens de width van 100% meegeven en geen vaste waarde.
Wat betreft de verschillende waarden even spelen wat voor jouw het gunstigst is. Door de bottom-margin hoef je er vervolgens ook geen lege <p></p> op te nemen voor de marge onderin.

Heb heel wat geleerd over div'jes. topic mag dicht