JürgenB: Element soll so breit wie nötig sein

Beitrag lesen

problematische Seite

Hallo Rolf,

hier der Quelltext:

<div id="outer">
	<div id="inner1"></div>
	<div id="inner2">Hier steht Text, der umgebrochen werden soll.</div>
</div>	Quelltext hier
#outer {
	position: relative;
	width: 300px;
	height: 300px;
	background-color: lightgray;
	resize: both; overflow: auto; 
}
#inner1 {
	background-color: #f00;
	position: absolute;
	width: 50px;
	height: 30px;
	bottom: 10px;
	left: 10px;
}
#inner2 {
	background-color: #faa;
	position: absolute;
	max-width: calc(100% - 90px);
	width: fit-contend;
	bottom: 10px;
	right: 10px;		
	text-align: right;
	text-wrap: balance; 
	padding: 5px;		
}

fit-contend war einer der Versuche, die nicht zum Ziel geführt haben. Ich habe aber auch max-contend und min-contend ausprobiert.

Das rosa DIV (#inner2) soll in der Breite nur den Platz einnehmen, den der Text im DIV benötigt.

Im Einsatz liegt im äußeren DIV eine Landkarte und im rosa DIV das Copyright, das so wenig von der Karte verdecken soll, wie nötig.

Gruß
Jürgen