IE: DIV Positionierung left:50 right:50px

[Conrad Friese]

Hallo,
ich ärgere mich mit dem Problem schon das ganze Wochenende herum und komme irgendwie nicht weiter. Ich habe eine Ebene die so positioniert werden soll, dass rechts 50px Rand und links 170px Rand sind. Funktioniert auch aber nicht im IE. Da hört die Ebene immer am rechten Bildschirmrand auf.

Gibts da ne Möglichkeit die trotzdem so zu positionieren?

.ebene {
position:relative;
top: 50px;
left: 170px;
right: 50px;
height: 50px;
width: auto;
background-color: #000000;
}

...

<div class="ebene"></div>

[Axel Richter]

Hallo,

ich ärgere mich mit dem Problem schon das ganze Wochenende herum und komme irgendwie nicht weiter. Ich habe eine Ebene die so positioniert werden soll, dass rechts 50px Rand und links 170px Rand sind.

Warum nimmst Du dann nicht die für Ränder zuständige CSS-Eigenschaft margin?

.ebene {

margin-top: 50px;
margin-left: 170px;
margin-right: 50px;

height: 50px;
background-color: #000000;
}

...
<div class="ebene"></div>

viele Grüße

Axel

[Conrad Friese]

Danke für die Antwort, habe ich auch schon probiert aber funktioniert in dem Fall nicht. IE nimmt einfach die 100% und rechnet die margin Angaben rechts und links einfach dazu.

.ebene {
 position: absolute;
 left: 0px;
 top: 120px;
 margin-right: 50px;
 margin-left: 170px;
 height: 50px;
 width: 100%;
 background-color: #00CC99;
}

<div class="aussen"></div>

http://dedel.selfhost.de/test.htm

[Axel Richter]

Hallo,

.ebene {
 position: absolute;

Hm. Du weißt nicht, was Du willst? Eben war die Position noch relative. Zwischen position:relative und position:absolute liegen Welten. Eventuell schreibst Du ja mal, was Du erreichen möchtest?

viele Grüße

Axel

[wahsaga]

hi,

Danke für die Antwort, habe ich auch schon probiert aber funktioniert in dem Fall nicht. IE nimmt einfach die 100% und rechnet die margin Angaben rechts und links einfach dazu.

natürlich, so ist es ja auch im box model definiert:
breite, die ein element einnimmt = width + margins + border.

du musst also die width-angabe hier weglassen, bzw. width auf auto setzen.

ja, kann sein, dass das mit absoluter positionierung nicht konform geht, da manche browser dann das element nur so breit machen, wie es sein inhalt erfordert.
also verzichte ggf. auch auf die absolute positionierung.

http://dedel.selfhost.de/test.htm

bitte lies </faq/#Q-19>.

gruß,
wahsaga

[Conrad Friese]

Hier mal direkt die Webseite: http://dedel.selfhost.de/nataS/

Ich kenn mich mit der Theorie von css nicht so wirklich richtig gut aus ;) Aber klar ist das so. Ich hatte zuerst alles relativ positioniert und dann absolut. Aber habe keine wirklich Zufriedenstellende Lösung gefunden. So wie es jetzt ist funktioniert es zwar, wenn man das Fenster verkleinert liegt das Content Fenster aber schon bald außerhalb des Bildschirm bei etwa 955x600 Pixeln schon.

[Ingo Turski]

Hi,

Hier mal direkt die Webseite: http://dedel.selfhost.de/nataS/

streiche sämtliche Angaben zu position (absolute und relative) und bei .main auch width: 100%;
Die Tabelle dürfte hier auch völlig überflüssig sein genauso wie einige DIVs.
Das:
<div class="main" style="background-color:#99CC99;">
      <div class="tableright">
    <div class="tableleft">
     <div class="tablehead"><div class="tableheadend">
ist ja noch schlimmer als reines Tabellenlayout.

freundliche Grüße
Ingo

[Conrad Friese]

Hi,
also ich habs einfach mit festen pixelangaben gemacht und zentriert.
Okay wie kann ich den Ramen sonst per css definieren wenn ich nur eine <div> habe? Oder meinst du ich sollte für das Menu Tabellen benutzen und die per css definieren?
liebe Grüße
Conrad

[Ingo Turski]

Hi,

Okay wie kann ich den Ramen sonst per css definieren wenn ich nur eine <div> habe?

Du kannst doch nahezu für jedes Element einen border defnieren.

Oder meinst du ich sollte für das Menu Tabellen benutzen und die per css definieren?

Natürlich nicht. Ich würde an Deiner Stelle nochmals ganz von vorne anfangen und ein _sinnvolles_ HTML-MarkUp schreiben - zunächst ohne ein einziges DIV zu verwenden. Dann würde ich mir überlegen, welche _Bereiche_ zusammenzufassen sind und diese mittels DIV gruppieren.
Danach erst würde ich versuchen, das gewünschte Design mittels CSS umzusetzen. Erst wenn Du hierbei auf Probleme stößt, die sich nicht mit CSS lösen lassen, würde ich den HTML-Code erweitern.

freundliche Grüße
Ingo

[Conrad Friese]

Hi,
jo vermutlich hast du Recht, aber ich wollte mal die möglichkeiten von css ausprobieren. Und ob ich ne Tabelle mit 3 Spalten mache oder 3 ineinander geschachtelte Ebenen macht denke ich keinen großen Unterschied oder liege ich da falsch? Der Rand besteht aus Grafiken...

http://dedel.selfhost.de/nataS/ < so sieht das jetzt aus.

[Ingo Turski]

Hi,

ich wollte mal die möglichkeiten von css ausprobieren. Und ob ich ne Tabelle mit 3 Spalten mache oder 3 ineinander geschachtelte Ebenen macht denke ich keinen großen Unterschied oder liege ich da falsch?

ja. Der Sinn von CSS ist, eben nicht mehr in verschachtelten (Tabellen-)Elementen zu denken.

Der Rand besteht aus Grafiken...

völlig unnötig, da Du diese einfachen Linien über border definieren kannst.

freundliche Grüße
Ingo

[Conrad Friese]

Hi,

Die Philosophie von CSS ist oder nicht ist mir in erster Linie mal gleichgültig solange es den Code verkürtzt und die Konfiguration in eine css Datei schafft. Wär schon schön und ellegant alles über eine Ebene regeln zu können. Die Linien gignen schon, aber beim Schlagschatten oder komplizierteren Rändern wird schon schwieriger. Am besten is wohl den Ramen tabellarisch zu machen und nur die Positionierung durch eine Ebene zu steuern. Vielleicht fällt dir ja noch eine Lösung ein, trotzdem vielen Dank für die Antwort.

lg
Conrad