div Breite 100% - 389px ?

[franzlst]

Ich positioniere meine divs absolut. So möchte ich einen div 389px vom linken Rand entfernt und bis zum rechten Rand gehend erstellen.
Mit "left:389px; width:100%;" geht der div über den rechten Rand hinaus und es wird ein Scrollbalken angezeigt.

Wie kann ich das Problem beheben? mir width:100%-200px; doch nicht?

TIA

Edit:
Der aktuelle Code:

 div.obereLinie {
	position:absolute;
	left:0px;
	top:38px;
	width:100%;
	height:6px;
	margin-left:389px;
	background-color:#FFCC00;
	font-size:1px;
	z-index:2;	
}

Edit:
OK, habs jetzt so gelöst, dass ich den Div über die ganze Seite gehen lasse (ohne linken Rand) und dann den linken Rand mit einem 2. div überdecke. Nicht ganz elegant aber funktioniert
Würde mich aber trotzdem über bessere Lösingen freuen ;-)

 

[CHaoSlayeR]

Hi,

damit sollte es im IE, Gecko und Opera funktionieren:

<div style="position:absolute; top:38px; left:0px; padding:0px; width:100%; height:6px; font-size:1px; z-index:2;">
	<div style="width:auto; height:100%; margin-left:389px; background-color:#FFCC00;">
		&nbsp;
	</div>
</div>

 

[SilentWarrior]

Warum nicht einfach left:389px; right:0?

 

[franzlst]

@CHaoSlayeR
Und was ist mit zB Netscape oder Firefox?

@SilentWarrior
Hab ich probiert, geht zumindest imt IE ned

 

[CHaoSlayeR]

Netscape und Firefox benutzen genauso wie Mozilla die Gecko-Engine.

Ich habs bei mir getestet mit IE6, Mozilla 1.7.5 und Opera 7.23 auf Windows XP SP2. Ich geh jetzt schlafen und morgen werd ich das nochmal in ein paar anderen testen...

P.S.: left:389px; right:0px; funktioniert bei kaum einem Browser derzeit, wenn überhaupt. Denn das "Aufziehen" von Elementen durch Positionierungsangaben (man beachte "Positionierung..."!) ist laut W3C nicht vorgesehen. Zumindest nicht in CSS 2.x. Wie es mit CSS 3 aussieht weiss ich noch nicht so genau...

 

[franzlst]

@CHaoSlayeR
Gut, habs jetzt ausprobiert, geht

Allerdings anscheinend nur für eine Einrückung nach rechts, nicht aber nach unten:

div.linkeLinieganz {
	position:absolute; 
	top:0px; 
	left:183px; 
	width:5px; 
	height:100%;
	font-size:1px; 
	z-index:2;
}

div.linkeLinie {
	width:100%;
	height:100%;
	margin-top:171px;
	background-color:#FFCC00;
	z-index:2;
}

und

<div class="linkeLinieganz"><div class="linkeLinie"></div></div>

Hier wird der div um die 171px nach unten aus dem Bild geschoben, die Folge sind Scrollleisten.

Um diese Seite handelt es sich:
http://franzl.r-u-s.de/neu
Die linke orange Linie soll bis zum unteren Rand gehen.

 

[CHaoSlayeR]

Hi, musste erstmal rumprobieren, bis ich eine Lösung gefunden hab, die im IE und Gecko funktioniert:

tu einfach in die CSS-Klasse "linkeLinieganz" ein "overflow: hidden;" einfügen, dann wird der Inhalt des ersten div's einfach nicht weiter gestreckt und einfach abgeschnitten.

 

[franzlst]

Danke, werde ich versuchen.

Habs jetzt so gemacht, dass ich statt "margin-top" ein "border-top-width" geschrieben habe, der die Farbe des Hintergrunds hat. Alternativ auch "border-style:hidden".
Geht auch.

Mal sehn was ich nehme.

Nochmal thx