Probleme mit verschiedenen Auflösungen

[CooperCpp]

Hallo Zusammen,

nachdem Google mir nichts brauchbares liefert suche ich mal das Gespräch mit euch

folgendes Problem:
Ich hab einen Header der über die gesamte Breite eines Fensters geht (ist jetzt für eine Auflösung von 1920 gemacht worden) und auf diesem kommt natürlich der Titel und das Logo, die Navigation etc.
Nun ist das Problem wenn ich alles positionieren wie ichs haben will, passt es zwar für die hohe auflösung, aber wenn ich dann auf kleineren Bildschirmen schaue, ist das header Hintergrundbild verschoben und der Inhalt scheint zu weit links zu sitzen.

Folgendes Hab ich versucht:
Header-Bild eine Breite von 100% zu geben. -> Inhalt bleibt gleich groß und verschiebt sich deshalb.

Header mit background-position: center top; in der Mitte zu halten, immernoch selber ergebniss.

css:

body.site {
	background-color: #f4f6f7;
	background-image: url(../img/bg.jpg);
	background-repeat: no-repeat; 
	background-size:100%;
}

kann mir da jemand sagen wie ich aus der miesere rauskomme?

Danke fürs Lesen und Helfen

lg Cooper

 

[vincitore]

AW: Probleme mit verschiedenen Auflösungen

du musst den Inhalt auch mit relativen Werten positionieren und dimensionieren. Wenn du also den Hintergrund in % angibst, solltest du das auch mit den Positionswerten und Größen machen.

 

[CooperCpp]

AW: Probleme mit verschiedenen Auflösungen

Hab das Problem inzwischen gelöst. Mein Plan war eigentlich das Standarttempalte protostar anzupassen, allerdings funktioniert das da nicht oder nicht mit meinem Code-Stil

Hab jetzt ein eigenes Template entwickelt und damit tut alles so wie immer.