• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Problem mit overflow

dkdenz

dkdenz

New member
Hi,
habe hier ein Problem.
Meine Datei ist so aufgebaut (Auszug):
Code: 
<div class="rahmen">
<div class="menu">
</div>
<div class="inhalt">
</div>
</div>
Das heißt, es gibt einen Layer für das Menü und einen für den Inhalt.
Um diese Beiden ist ein Layer "gespannt", welcher sich "rahmen" nennt.
Positioniert werden sie durch CSS.
Dies hier sind die relevanten Teile der CSS:
Code: 
div.rahmen
{
width:100%;
height:100%;
text-align:left;
margin:0px;
padding:0px;
overflow:visible;
background-color:transparent;
z-index:0;
}
div.menu
{
position:absolute;
width:200px;
left:10%;
background-color:#f0f8ff;
padding-top:24px;
margin:0px;
height:250px;
overflow:visible;
background-image:url(bilder/ecke_menu.gif);
background-repeat:no-repeat;
background-position:top right;
display:block;
z-index:0;
border-width:0px 0px 1px 1px;
border-color:#d4d0c8;
border-style:solid;
}
div.inhalt
{
margin-left:200px;
background-color:#f1f2eb;
overflow:visible;
padding:24px 0px 24px 24px;
height:400px;
background-image:url(bilder/ecke_inhalt.gif);
background-repeat:no-repeat;
z-index:0;
border-width:0px 1px 1px 0px;
border-color:#d4d0c8;
border-style:solid;
}
Nun stellt der IE es so dar, wie ich es wollte, nämlich, dass sich das "div.inhalt" bei Überlänge vergrößert.
Alle anderen Browser tun dies nicht, sondern behalten die Höhe ein und lassen den Inhalt über die untere Kante drüberlaufen.
Was ist zu tun?
 
Ich habe jetzt height:100%; bei "inhalt" und "rahmen" gemacht und schon geht es,
aber dass Problem liegt an den Scrollbars.
Wenn der Inhalt der nicht so groß ist, werden bei Mozundco keine Scrollarrows eingeblendet,
was dazu führt, dass der Inhalt der Seite immer hin- und herspringt in der Breite...
Was kann ich dagegen tun???
 
Hey Leute, etwas mehr Einsatz wäre wünschenswert...

Ich habe bis jetzt alle mir erdenklichen Abweichungen ausprobiert,
aber keine hat auch nur in etwa eine Lösung dargeboten...

:whacky:
 
also am ende hätt ich so gemacht(wenn du da nicht schon selber drauf gekommen bist...)
Code: 
<style>
  div.rahmen
  {
  width:100%;
  height:100%;
  text-align:left;
  margin:0px;
  padding:0px;
  overflow:visible;
  background-color:transparent;
  z-index:0;
  }
  div.menu
  {
  position:absolute;
  left:10%;
  background-color:#f0f8ff;
  padding-top:24px;
  margin:0px;
  height:250px;
  overflow:visible;
  background-image:url(bilder/ecke_menu.gif);
  background-repeat:no-repeat;
  background-position:top right;
  display:block;
  z-index:0;
  border-width:0px 0px 1px 1px;
  border-color:#d4d0c8;
  border-style:solid;
  }
  div.platzhalter
  {
  visibility:hidden;
  position:relative;
  width:200;
  }
  div.inhalt
  {
  margin-left:200px;
  background-color:#f1f2eb;
  overflow:visible;
  padding:24px 0px 24px 24px;
  height:400px;
  background-image:url(bilder/ecke_inhalt.gif);
  background-repeat:no-repeat;
  z-index:0;
  border-width:0px 1px 1px 0px;
  border-color:#d4d0c8;
  border-style:solid;
  }
</style>
</HEAD>
<BODY>
<div class="rahmen">
<div class="menu">
<div class="platzhalter">
</div>
  teeeeeeeeeeeeeeeeeeeeeeeeeeeeeeexxxxxxxxxxxxxxxxxxxxxxxxxxxxxt
</div>
<div class="inhalt">
</div>
</div>
 
da ich diesen post doppelt hatte, nutz ich ihn einfach um gute nacht zu sagen.

gut nacht :D .......zzzzzzzzzZZZZZZZZZZZ
 
Zuletzt bearbeitet:
Also für mich sieht das nach einer üblen DIV Suppe aus (was im Prinzip genau so schlimm wie Tabellen zum Layouten zu verwenden ist).

ich kann aber an dem Beispiel auch nicht erkennen wie es aussehen soll. Bei mir im firefox, sehe nur zwei Boxen, die sich überschneiden. D.h. der Text von Inhalt wird von der Box Menu überdeckt und was die Box rahmen für einen Zweck hat ist mir schleierhaft. Hast du einen Link wo man sich das ansehen kann, wie es mit Inhalt aussehen soll?
 
Aaaalso, wenn man einem div eine exakte Höhe gibt z.B. height:400px; und overflow:visible;
dann geht das beim Mozilla folgendermaßen:
Er stellt den Text der höher als diese 400px ist, über den unteren Rand dar.

Das div wird nicht mit erweitert wie eigentlich erwartet.

Gibt man dem div allerdings den Wert height:auto; dann schon.
Ist aber irgendwie blöde...

Kennt keiner einen Hack dagegen?
 
Öh, ich lese Tut's nicht so oft und wenn, überfliege ich sie.
Ist dann was für mich dabei, lese ich genauer... :rolleyes:

Mein Problem war auch etwas anders gelagert,
habe es aber gelöst, ähnlich wie in Deinem Tut beschrieben...

Im Prinzip ging es darum, dass Mozilla und IE andere Darstellungen liefern,
wenn der Inhalt eben nicht übergroß ist.
IE zeigt die Scrollarrows auch dann an, Mozi eben nicht.
Dadurch kommt es zu unschönen Versätzen,
wenn man weiterlinkt und auf eine Seite kommt,
die übergroßen Inhalt hat...
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben