# <div> über gesammte Seitenbreite ziehen



## Jukkales (29. September 2007)

Hallo,

Ich will einen <div> über die gesammte Seite ziehen, also links gehts los und im Browser hört's rechts wieder auf, auch wenn man die Größe verändert.

Nur ergibt sich das Problem. wenn ich das Fenster öffne ist es super, scroll ich dann nach Rechts ist plötzlich der div zuende.


```
<div style="background:url(images/index_01.gif); background-repeat:repeat-x; margin:0; padding:0; height:37px; width:100%">&nbsp;</div>
```
Das ist der Code.

Kann mir da jemand einen Tipp geben?

Mfg Jukka~


----------



## Maik (29. September 2007)

Hi,

ein Blockelement richtet seine Breite bzw. eine relative Breitenangabe, wie width:100%, an seinem Elternelement aus.

Von daher wird wohl in deinem Seitenkonzept der rechte Rand des Anzeigebereichs die Begrenzung darstellen.


----------



## Jukkales (29. September 2007)

Der Div kommt gleich nach dem <body>, und im Body steht auch 100% der Breite. Also müsste sich das Div ja auch Theoretisch als Child danach richten, tut es aber nicht.


----------



## Maik (29. September 2007)

Erstreckt sich das DIV etwa nicht bis zum rechten Fensterrand?

Ansonsten verhält es sich so, wie ich es eben erläutert habe, dass der rechte Fensterrand die Grenze für width:100% darstellt.


----------



## derpfaff (29. September 2007)

Theoretisch musst du keine Breitenangabe machen. Ein Div-Tag geht immer über die ganze Breite (wenn die Breite nicht angegeben wird).
Nimm also im Body und im Div mal die Breitenangabe raus. Vielleicht funktioniert das ja schon...

Gruß,
derPfaff


----------



## Jukkales (29. September 2007)

Maik hat gesagt.:


> Erstreckt sich das DIV etwa nicht bis zum rechten Fensterrand?
> 
> Ansonsten verhält es sich so, wie ich es eben erläutert habe, dass der rechte Rand die Grenze für width:100% darstellt.



Sorry ich hab mich ehr Falsch ausgedrückt. Es stimmt ja der Div geht bis zum Fensterrand, aber eben nur bis zum Fensterrand. Scrollt man weiter nach rechts raus sieht man anstelle des Div's den normalen hintergrund, was ich ja nicht will.

Ich will sogesehn den Div so einstellen das dieser als "zweiter Hintergrund" fungiert,der sich anhand der X Achse immerwieder wiederholt. 

Ich habe auch einmal wie derpfaff sagte, die Breitenangaben ausgelassen. Es geht aber trodzdem nicht.


----------



## derpfaff (29. September 2007)

Kannst du uns die Seite mal zeigen?
Es wirkt so, als blockiert etwas das Div...


----------



## Maik (29. September 2007)

Wenn sich die Seite nach rechts scrollen lässt, muss nach "Adam Riese" dem DIV ein Element folgen, das eine Breite von 100%+X besitzt, sei's durch den Elementinhalt, oder eine gesetzte Breite.

Vielleicht solltest du hier mal besser den vollständigen Quellcode der Seite (HTML + CSS) posten, oder einen Link zur Seite nennen, damit man einen Überblick vom weiteren Seitenaufbau gewinnen kann.


----------



## Jukkales (29. September 2007)

Maik hat gesagt.:


> Wenn sich die Seite nach rechts scrollen lässt, muss nach "Adam Riese" dem DIV ein Element folgen, das eine Breite von 100%+X besitzt, sei's durch den Elementinhalt, oder eine gesetzte Breite.
> 
> Vielleicht solltest du hier mal besser den vollständigen Quellcode der Seite (HTML + CSS) posten, oder einen Link zur Seite nennen, damit man einen Überblick vom weiteren Seitenaufbau gewinnen kann.



Natürlich: http://testserver.records-of-lunia.de/?showbox

Ich weiß nicht ob das Problem im FireFox so auch ist, aber in Opera ist es so. IE übrigends auch


----------



## derpfaff (29. September 2007)

Ok, und welches Element soll jetzt nach rechts gehen? Bei mir sieht die Seite okay aus, bis auf den blauen Schein rechts neben dem Banner...
Mach am besten einen rotem Rahmen um das entsprechende Div!


----------



## Maik (29. September 2007)

Wenn die beiden braunen Balken einen festen vertikalen Abstand zueinander besitzen, könntest du sie gemeinsam mit dem Hintergrundmuster in einer Grafik vereinen, und diese als Seitenhintergrundbild einsetzen, das in der X-Achse wiederholt wird.

Ansonsten halten sich alle Browser bei deinem derzeitigen Modell an den w3c-Standard.


----------



## andreasst (29. September 2007)

Hab mir deine Seite im IE6 und im Firefox angesehen:
Prinzipiell wäre mal zu sagen, deine Seite ist aus lauter geschachtelten Tabellen aufgebaut... was eigentlich nicht wirklich der Sinn von Tabellen ist, ein aufbau aus <div> Boxen mit Css formatiert wäre meiner Ansicht nach vorzuziehen.

Dein Div oben verhält sich in beiden Browsern korrekt, es hat jeweils 100% Breite vom Browser. 
Deine Tabelle hat allerdings eine fixe Breite eingestellt. Ist das Browserfenster schmäler als die Tabelle wird das ganze zu Seite hin scrollbar, wärend dein <div> nach wie vor 100% vom Fenster hat.

Mein Lösungsvorschlag: Entweder das gesamte Seitendesign flexibel machen, was vorzuziehen wäre, weil nicht jeder kann die etwas über 1024px Seitenbreite anzeigen, auch im Hinblick auf mobile Geräte(PDA, Handy....) . Offensichtlich du auch nicht, wenn es bei dir scrollbar ist. 

Oder eben auch das Div fix einstellen, was sicher die einfacherere aber auch weniger optimale Lösung ist.


----------



## Jukkales (29. September 2007)

Der Aufbau ist eigentlich nur so Geschachtelt weil ich da dynamisch mit PHP Inhalte einfügen will, bearbeiten und alles mögliche mit machen will.

Die beiden Balken haben auch keinen Festen vertikalen abstand zueinander, sondern sind, je nach Inhalt des Contents, verschieden.
Die Seite ist für 1024px aufwärts gemacht, von daher reicht mir das so, muss ja nicht zu perfekt sein ^^

Aber das mit den Divs soll halt nicht Fensterbreite sondern Seitenbreite betragem. Wenn dies nicht geht lass ich mir was anderes einfallen.

PS: Den Aufbau mit Div Blöcken habe eich schon lange aufgegeben. Ganz einfach darum, ich benutzte diese art imemr jedoch gab es in irgendeinem Browser immer probleme, besonders gerne in Firefox


----------



## dotterbart (29. September 2007)

Ich sehe das auch wie Andreas. DIV-Elemente wären hier besser gewesen und sehr viel flexibler. Du bräuchtest auch die Bilder nicht so zerstückeln wie du es für die Tabellenfelder machen mustest.
Mit CSS kanst du sogar Bilder skalierbar machen. So kann man Bilder wie Texte der gewünschten Größe anpassen. In gewissen Grenzen jedenfalls.

db


----------

