Zweispaltige Tabelle erstellen

[Chris2018]

Hallo Zusammen,

ich benötige eine HTML Tabelle die innerhalb einer App auf verschiedenen Geräten angezeigt werden soll:

• 2 Spalten
• 7 Zeilen
• 1 Überschriftenzeile über beide Spalten

Bisher habe ich folgenden Code aufgebaut:

<table border="1" cellspacing="0" cellpadding="5"> <tr>
<th colspan="2">
Attribute
</th>
</tr>
<tr>
<td>
Status
</td>
<td width="100%">
<img src="URL";; width=200>
</td>
</tr>
<tr>
<td nowrap="true">
Bezeichnung
</td>
<td>
Löschwasserdrainage
</td>
</tr>
<tr>
<td nowrap="true">
Bemerkung
</td>
<td>
mit Tiefenpumpe
</td>
</tr>
<tr>
<td nowrap="true">
Volumen / Leistung
</td>
<td>
1100 Liter/min
</td>
</tr>
<tr>
<td nowrap="true">
Foto
</td>
<td>
<a href="URL"><img src ="URL"; width="100%"></a><br><br>
</td>
</tr>
<tr>
<td nowrap="true">
Daten aktualisieren
</td>
<td>
<a href="Daten">URL">Daten aktualisieren</a>
</td>
</tr>
<tr>
<td nowrap="true">
Fehler melden
</td>
<td>
<a href="mailto:MAIL?cc=&subject=Fehlermeldung%20Maps&Body=TEXT">Fehlermeldung</a>
</td>
</tr>
</table>

Den Inhalt der Tabelle habe ich etwas zensiert. Mein Wunsch ist folgender: Die erste Spalte soll ohne Zeilenumbruch angezeigt werden. Da das "nowrap="true" im <td>. Das funktioniert unter Android problemlos, bei iOS gibt es da Probleme. Die rechte Spalte soll einfach auf die gesamte Bildschirmbreite ausgedehnt werden. Die eingefügten Bilder sollen sich proportional passend skalieren.

Der CSS Code muss zwingend in den HTML Code "eingebaut" sein. Also auslagern in extra Datei geht nicht.