#wrapper BG auf 100% width

[jeykon]

Ich würde gerne mein Wrapper Backgroundbild auf 100% Breite setzen so wie auf contao.org. (Der Orangene Balken oben beim Topmenü)
Body ist bei mir schon für was andres belegt, weiß jemand wie das dort gelöst wurde?

Edit: CSS: reset, layoutbuilder, responsive grid

[schman]

Auf contao.org ist das direkt im wrapper mittels Hintergrund belegt (http://contao.org/files/images/layout/wrapper.png). Dieses ist nur 1px breit und hat die Höhe von 32 pixel als Hintergrundfarbe wurde dann eben noch das grau dazu verwendet.

[jeykon]

Das beantwortet ja nicht meine Frage, ich habe schon verstanden was für eine Datei genutzt wird und wie das aufgebaut ist.
Mich interessiert wie man den Balken auf die volle Browser-Breite bekommt, wenn ich das versuche stoppt das repeat-x nicht am Browser-Rand sondern am Wrapper.
Ich könnte alternativ für 2 Background-Bilder doch auch HTML und Body Backgrounds nutzen oder spricht da etwas gegen?

[schman]

Bei Contao ist der Wrapper genau 100% breit, also die volle Breite des Schirms. der Bereich header, container, footer wurden dann mittels margin: 0 auto zentriert.
Alternativ kannst du ja den background dem body zuweisen.

[jeykon]

Ja das auto-zentrieren macht ja das Contao-Layout anscheinend. Wenn ich jetzt wrapper 100% width gebe, zieht er das komplette layout auf browser-breite auseinander.
Wie ich schon gesagt habe, body-background ist schon belegt.

[Nina]

Was schman dir sagen will:

#wrapper auf volle Breite stellen
#header, #container, #footer z.B. auf width: 960px; margin: 0 auto; stellen

[jeykon]

Vielen Dank für die Antworten. Hat funktioniert.

[MacPix]

Bei mir kommt das so raus.. was mache ich da falsch?
links neben gelb ist left und rechts davon right

[schman]

Hast du ein Link, damit man sich das online anschauen kann?
So kann man nur raten. Auf alle Fälle stimmt etwas mit margin, padding nicht.

[MacPix]

Hast du ein Link, damit man sich das online anschauen kann?
So kann man nur raten. Auf alle Fälle stimmt etwas mit margin, padding nicht.

Nein online ist sie nicht... sie sieht so aus wie auf dem Bild, der kunde will die noch nicht so online sehen, sonst sehen alle die Seite.
was kann ich sonst machen?

[MacPix]

ok das eine geht...

aber was ist wenn ich der header und footer auch 100% will, damit ich oben und unten einen ganzen Balken header/footer habe?
und der container 960px... und auch die header und footer .inside 960px

da wird mir der container viel grösser.... was kann ich da machen

[jeykon]

#header und #footer liegen im Wrapper. Das heißt der Wrapper würde 100% Seitenbreite benötigen, der container bräuchte dann aber ne fixe breite.
Du könntest natürlich den header und footer 100% breit machen, aber frag dich ob das sinnvoll ist.

Ich bin mir nicht sicher, aber ich gehe mal davon aus das du nur optisch Volle Breite Breite möchtest, so wie es aktuell relativ "in" ist.
Das mit den Balken könntest du mit background-image lösen.

Du kannst z.B. dem Wrapper 100% Breite geben und dann beim wrapper oben einen Balken mit background-repeat positionieren.
Andere Elemente mit voller Seitenbreite wären body oder html.

Du könntest natürlich den footer auf 100% Breite setzen, müsstest dann aber den Inhalt wieder Zentrieren (vorausgesetzt du hast statisches oder zentriertes responsive layout).

Edit: Welche Contao Version nutzt du und welche CSS files sind aktiviert?

[MacPix]

Ich nutze Contao 3 .. Css sind aktiv.

Em ich finde es von vorteil wenn ich ein header und footer background color haben möchte, die ich auch schnell ändern kann, um die differenz dem kunden zeigen zu können.
Es ist für mich auch viel schneller und einfache, und ich habe eingentlich vorher oftmal so gemacht.
Ich weiss auch nicht ein schnelleren weg um 2 bilder in den body oder wrapper zu tun, dass das einte immer so gross ist wie der header und das ander so wie der footer.

[MacPix]

Hallo Leute

Ich stehe immer noch vor dem Problem dass, sich der container nicht auf 960px stellen lässt bei 2 oder 3 spalten layout. mein nur einem Main ist es tiptop.

Ich möchte gerne:
wrapper 100% breite
header und footer auch 100%
header und footer insite, und container 960px

Aber da geht was einfach nicht. Es war bei Contao 2.X Tip top...
was kann man machen das es auch wider so gehen würde...

Mein Vorteil der Header und Footer background über 100%

[MacPix]

Hast du ein Link, damit man sich das online anschauen kann?
So kann man nur raten. Auf alle Fälle stimmt etwas mit margin, padding nicht.

weiss echt nnicht was machen....

hier seht ihr evt was

http://ellem-beauty.ch/contao/

Benutername -> contao
pw -> contao3contao


ber container ist einfach immer zu breit .. am besten bei kontakt über mich zu sehen

[MacPix]

Leute ist das die Rcihtige Lösung?

habe Header und Footer 960px

Container auf 740px weil left 220px ist.

bei den layout scheint es zu funtionieren..

[kos]

Mit den Anmeldedaten von oben kommt man nicht in BE.
Und im FE => Under Construction.
Sorry

[MacPix]

Mit den Anmeldedaten von oben kommt man nicht in BE.
Und im FE => Under Construction.
Sorry

Hab es raus genommen... Kanns wider aufschalten

Jetzt ab ich aber noch ein anders problem..
Beim ipad ist im querformat alles io aber hochformat ist es zu breit auch bein neuladen und das repeat bild wird abgeschnitten

[MacPix]

Ich raff es gar nicht mehr..

Würde gerne:
Wrapper 100%, header und footer 960px grid und holy grail.



was nicht geht:
am Computer ist es nicht schlecht... ausser dass wenn man des Browser zusammen zieht man es nicht wie bei cotao.org oder werk36.de. es gibt den zwischen spung nicht, und die ganz kleine version wo das navi sich ändern solte

Auf den ipad hab ich das problem dass es beim hochformat mir den header/wapper igend wie rechts oben was fehlt. aber beim querformat super ist...

wie bringe ich das hin mit der sache ?? wer kann mir bei dem helfen.

auch das dass mainnav beim iphone ein butten wir der aber das navi wie contao.org sichtbar macht ist per javascript wie es aussieht... der button kommt auf dem iphone nur geht er nicht...

Log in daten wie weiter unten wider zur verfügung.