High zusammen,
eigentlich geht es gar nicht mal um eine richtige Tabelle, ich möchte nur zwei Bereiche nebeneinander darstellen, von denen der linke genau so breit is wie sein Inhalt (nebst padding und so), der rechte dann (fast) den gesamten Berich bis zum rechten Rand (allerdings mit style="right:15px"
) einnimmt. In diesem rechten Bereich soll der Text dann auch rechtsbündig erscheinen.
Da ich vorher schon etwas tabellen-artiges mit CSS gebastelt hatte, habe ich bisher folgenden Ansatz verfolgt:
.ntab { /* keine Ahnung, ob das nötig ist */
width:100%;
}
.nrow { /* das schon eher */
display:table-row;
/*right:15px;*/
width:100%;
}
.nrowl {
display:table-cell;
/*width:10%;*/
}
.nrowr {
display:table-cell;
padding-left:1ex;
/*right:15px;*/
/*min-width:5%;*/
/*width:100%;*/
text-align:right;
}
Die aktuell sichtbaren Angaben für width, right und min-width sind mehr oder minder willkürlich, daher hier mal auskommentiert. Ich habe schon so ziemlich alle Kombinationen durch.
Im HTML-Part sieht es dann so aus:
<div class="ntab">
<div class="nrow">
<div class="nrowl">
Text für die linke Seite
</div>
<div class="nrowr">
Text für die rechte Seite
</div>
</div>
</div>
So, welche Geometrie-Werte sollte ich nun angeben, damit die linke Seite abhängig von ihrem Inhalt dimensioniert wird, die rechte dagegen den Rest einnimmt?
nrowr.width:100% funktioniert auf den ersten Blick, erzeugt aber im linken Teil Zeilenumbrüche, wenn der Text aus mehreren Worten besteht.
nrowl.width: oder nrowl.min-width: mit irgendwelchen Werten zu füllen, verhackt mir die Breite der linken Seite, sollte sie doch mal weniger Platz brauchen. Das wäre möglicherweise nicht so schlimm, aber diese "Zelle" hat eine andere Hintergrundfarbe als der Rest des Dokuments, also ist der Effekt sichtbar und wirkt ziemlich unausgeglichen.
width=* (wo auch immer) scheint überhaupt keinen Effekt zu haben.
Irgendein Kenner hier, der mir da weiterhelfen kann? Danke im Voraus und schönen Gruß,
Jagged