Tabelle anordnen per CSS

Hallo,

ich würde gerne eine Tabelle anders anordnen, je nachdem ob die Webseite von einem PC oder von einem Smartphone aus besucht wird.

Ich habe bereits

@include screen-sm-up {
/* Hier der CSS-Code */
}

etc. aufgeschnappt, weiß jedoch nicht so genau, wie ich die Anordnung der Tabelle damit realisieren kann.

Es geht um diese Tabelle: http://feuerwehren-fredenbeck.de/ansprechpartner/

Die sieht mobil natürlich nicht so gut aus (siehe Screenshot).

Die Ansprechpartner sollen mobil also untereinander angezeigt werden, nicht wie jetzt nebeneinander. (und die Breite auf die Displaybreite angepasst werden)

Kann man das per CSS irgendwie lösen?

Falls jemand eine andere Idee hat, als es über eine klassische Tabelle zu lösen, gerne einen Tipp geben.

Danke!

Zitat von zackOmat

<ul class="containerBoxList doubleColumned">

<li>…</li>

<li>…</li>

<ul>

Schon mal vielen Dank!

Muss ich dann jeden Eintrag in ein eigenen <ul>-Tag packen?

Oder hintereinander weg?

Und wie kann ich die Einträge trennen?

Momentan hab ich es so gelöst. Das Ergebnis sieht zwar grundsätzlich nicht schlecht aus, jedoch nicht wie gewünscht.

Ich hätte es von der Optik her in der Desktopansicht gerne so wie bisher bzw ähnlich.

Wahrscheinlich bin ich gerade nur zu blöd um die Einträge links bzw rechts anzuordnen.

<ul class="containerBoxList doubleColumned">
    <li><img src="http://www.fredenbeck.de/static/images/bilder/sven_dammann-900000627-20420-10.jpg"></li>
    <li>Gemeindebrandmeister</li>
    <li>Sven Dammann</li>
    <li>Wiesenstraße 31, 27449 Kutenholz</li>
    <li>Telefon: 04762 / 923326</li>
    <li>gbm@feuerwehren-fredenbeck.de</li>

    <li><img src="http://www.fredenbeck.de/static/images/bilder/torsten_ropers-900000559-20420-10.jpg"></li>
    <li>Stellvertretender Gemeindebrandmeister</li>
    <li>Torsten Ropers</li>
    <li>Osterende 27, 21717 Fredenbeck GT Schwinge</li>
    <li>Telefon: 04149 / 7325</li>
    <li>stv.gbm@feuerwehren-fredenbeck.de</li>
</ul>