100% Höhe des Viewports + Padding davon abziehen?

[Ralf]

Hallo liebe Forenuser,

wir arbeiten zur Zeit an einem Webapplication-Tool um Bilder zu zerschneiden.
Das Layout soll so aufgebaut werden, dass das div#container die Arbeitsfläche oder auch den Schreibtisch darstellt (ähnlich wie der graue Hintergrund aus Photoshop z.B.). Der Body selbst, also der Viewport in diesem Sinne, soll keine Scrollbars erhalten.

Ein weiteres Div (#imagesrc) beinhaltet das zu bearbeitende Bild, welches Scrollbalken erhält, damit man ein evtl. zu großes Bild scrollen kann. Die Arbeitsfläche hat eine Höhe von 100%. Der Bild-Container ebenfalls. Jedoch soll die Arbeitsfläche ringsum ein 20px-Padding erhalten, sodass das ganze einem hellgrauen Bilderrahmen ähnelt (in diesem Rahmen sollen später Werkzeuge erscheinen). Im Endeffekt wirkt das ganze dann wie eine Art Maske, die auf dem großen Bild liegt.

Meinen bisherigen Stand findet ihr hier: Testcase

Nun zu meinem Problem (ich gehe jetzt bewusst nur auf den Fx-Browser ein):
Da sich das Padding zur Höhe dazuaddiert wird der Bild-container unten aus dem Viewport gedrückt. Sprich: im Viewport habe ich nun ringsum keinen konstanten 20px Rahmen mehr.

Gibt es eine Möglichkeit die Paddings und Borders von den 100% abzuziehen, damit das Container-Div sich immer genau in den Viewport einpasst?

Für einen Denkanstoß wäre ich sehr dankbar.

Grüße,
Ralf

[LX]

Schau Dir mal absolute Positionierung an (und CSS expressions für den MSIE).

Gruß, LX

[Tim]

Hi,

gleiches Problem hatte ich auch:
http://forum.de.selfhtml.org/archiv/2009/1/t182669/#m1208873

Ich perönliche habe mich dann doch wieder für eine tabelle entschieden, aber das muss jeder selbt wissen. Geht nämlich auch wenn ich weitere Container nur dem Layout zuliebe einbinde, und von daher ...

Tim