[HTML/CSS] Absolut pos. Elemente ohne horiz. Scrollbalken

[SubData]

Habt ihr mal overflow: auto probiert?

[Matze]

@Armin: Ja das geht nicht. Ich weiß im Vornherein auch nicht, auf welcher Höhe das span-Element sitzt.
@Ronny: Ich habe schon sehr viel versucht und auch mit "overflow: auto" habe ich es nicht hinbekommen.

[TurboMartin]

Also laut dem VisualStudio gibt es auch die CSS-Eigenschaft min/max-width, die soweit auch bei meinen Browsern zu funktionieren scheinen tut, aber ich weiß nicht wie weit das genormt ist. Vielleicht hilft dir das weiter ;)

[Matze]

Ich wüsste nicht, wieso mir das helfen soll. ;)
Es geht nicht darum, die Breite einzustellen, sondern die Elemente in den Hintergrund zu setzen bzw. so zu manipulieren, dass keine Scrollbalken entstehen.

[SubData]

Dann halt so:

Code:

BODY { width: 100%; max-width: 100%; overflow: hidden !important; }

Edit: "Quote" => "Code" :)

[Matze]

Und was soll mir das bringen? :gruebel:

"body" und "overflow: hidden" wäre komplett falsch, da so sämtliche Scrollbalken, auch die vertikalen, unterdrückt werden.
Aktuell nutze ich "body" und "overflow-x: hidden". Aber auch hier habe ich das Problem, das bei einer Breite des Fensters kleiner als 900 Pixel kein Scrollbalken angezeigt wird.

[s.h.a.r.k]

Du wirst nicht drum herum kommen, dir einen "dirty-Fix" zu überlegen. Du hast folgende Möglichkeiten eine Scrollbar zu unterdrücken:

• Ein Hintergrundbild, wobei das dann wieder nicht überlagern kann. (außer du machst den Container auch als Bild, was aber eher naja ist :zwinker: )
• Du lässt ein div den main-container überlagern, so wie ich es in meinem letzten Post gezeigt habe, aber da tritt dann das Problem auf, dass du nicht mehr durchklicken kannst.
• Negative left-Eigenschaft in Verbindung mit position:relative/absolute, wobei das halt nur für den linken Rand funktioniert.

Ich überlege im Moment schon die ganze Zeit, wie ich den mittleren Vorschlag umbauen kann, dass das funktioniert. Du brauchst halt einen Container, der overflow:hidden hat und folgendes kann: es müsste eine Kombination aus der Eigenschaft left und width geben, die folgendes ergeben: der Container startet bei einem festen x-Wert und läuft *genau* bis zum rechten (oder auch linken) Rand. Wenn ich das Fenster kleiner mache, so wird auch das div kleiner, u.U. wird width halt negativ, aber das sehen die User ja nicht, da das Fenster dann zu klein ist. Jedenfalls war das die Idee dahinter. Aber ich kenne keine Möglichkeit für eine passende Angabe der Breite...

[Namenloser]

Ich bin nicht ganz sicher, ob ich richtig verstanden habe, was du vorhast.

XML-Code:

<div style="min-width:900px; overflow:hidden">
   <div style="width: 900px; position:relative; margin: auto; background-color: #f00; height: 20px;">
      <span style="position: absolute; width: 200px; left: -150px; z-index: 3; background-color: #0ff;">Test</span>
      <span style="position: absolute; width: 200px; right: -150px; z-index: 3; background-color: #0ff;">Test</span>
   </div>
</div>

Ist es das, wonach du suchst?

[Matze]

Ich habe eine Demo angehängt. Vielleicht wird es dann klarer.

Der HTML-Code ist gekürzt, CSS habe ich so gelassen. Relevant sind die Bereiche der HTML-Datei, die mit einem Kommentare versehen sind (das sind 2 Kommentare).

Wenn das Browserfenster breiter ist als der mittlere Container, sollen keine Scrollbalken angezeigt werden, auch wenn der rote und blaue Kasten nicht ins Browserfenster passen.
Wird das Fenster so weit verkleinert, dass der mittlere Container nicht mehr vollständig dargestellt werden kann, sollen Scrollbalken für diesen Container angezeigt werden.

[Namenloser]

Ich find das eigentlich nicht so toll, wenn ich Hirnschmalz dafür aufwende, anderer Leute Probleme zu lösen, und man meine Lösung dann anscheinend nicht mal ausprobiert. Mein Beispiel war genau, wonach du gesucht hast :roll: