CSS | Design an Auflösungen anpassen

Hey,

habe das Problem, dass meine Webseite zwar für mich angepasst ist (vom Design aus), jedoch Nutzer mit anderen Auflösungen diese nicht korrekt angezeigt bekommen.
Einzelne Elemente sind dann verschoben oder auch die ganze Seite.

Habe mich bereits mal im Netz erkundigt, dort fand ich die Information, alle CSS Angaben, wie Positionen prozentual anzugeben.
Jedoch hilft das ebenfalls nichts.

Hat jemand eine Lösung?

Danke im Voraus.

Grüße

//E Ein normaler CSS Code, den ich so verwende:

#pwchange{
	position: relative;
	height: 80%;
	width: 50%;
	left: 380px;
	right: 10%;
	top: 26%;
}

Jo, ist mir auch gerade eingefallen
Ist ein einfacher Code, der Box, die auch verschoben wird.

#pwchange{
	position: relative;
	height: 80%;
	width: 50%;
	left: 380px;
	right: 10%;
	top: 26%;
}

Das müsste dann wie genau aussehen?

Wenn ich bspw. an die Stylesheetverweisung media="screen" dranhänge, bringt das ebenfalls nichts.

habe es nun angepasst:

@media(max-device-width: 1366px) {


}

Dadrin dann halt den kompletten CSS Code.
Jedoch bei usern mit einer höheren Auflösung wird die Seite dann falsch angezeigt und zwar noch schlimmer, als vorher.

Habe mal testweise alle Div's auf der Startseite in Prozent angegeben.

Jeodch verschiebt es sich immer noch.

Hier mal Beispiele.

Von mir:
http://www.bubblepic.de/files/RWimc4Hvz2.jpg

Von anderen:
http://www.bubblepic.de/files/Kp10OQUUci.jpg
http://puu.sh/62q74.jpg

Alle CSS Codes, die auf dieser Seite relevant sind:

#statsSkin{	position: absolute;	height: 80%;	width: 50%;	left: 1%;	right: 10%;	top: 20%;}#stats{	position: absolute;	height: 80%;	width: 50%;	left: 14%;	right: 10%;	top: 20%;}#pwchange{	position: absolute;	height: 80%;	width: 50%;	left: 35%;	right: 10%;	top: 26%;}#namechange{	position: absolute;	height: 80%;	width: 50%;	left: 51.5%;	right: 10%;	top: 26%;}#logo{	position: absolute;	left: 10%;	height: 40%;	width: 80%;	background-size: 100%;	z-index: 0;}#footer{	position: absolute;	top: 93%;	left: 45%;}#main{	position: absolute;	background-color: white;	height: 60%;	left: 10%;	right: 10%;	top: 30%;	display:inline-block;}#menue_block{	position: absolute;	height: 30%;	width: 100%;	background-image: url(menue_bg.png);	background-repeat: no-repeat;	background-size: 100%;}#menue_content{	position: absolute;	height: 20%;	width: 80%;	left: 45%;	right: 10%;	top: 20%;	background-size: 100%;}#login{	position: absolute;	height: 20%;	width: 14%;	left: 30%;	right: 10%;	top: 30%;}#content{	position: absolute;	height: 80%;	width: 50%;	left: 30%;	right: 10%;	top: 20%;}

Zitat von Arendium

Geb das left auch in Prozent an

habe ich doch schon längst gemacht. :o

Siehe 2 Posts hierrüber.

Hier der Post nochmal meines letzten Posts als Push, da ich keine 2 Posts hintereinander machen kann und editieren wohl keinen Pusheffekt mehr hat.
benötige immer noch Hilfe, da die divs immer noch verschoben sind.

Habe ein wenig rumprobiert.

Zitat

Du könntest es gaaanz einfahc machen.

Eine Tabelle ohne Border.
1. Spalte eine feste Breite (für das Bild)

HTML

<table>
<tr>
<td width="BILDBREITEpx">
<img />
</td>
<td>
<fieldsets>
</td>
</tr>
</table>

Dann jedem Fieldset 33% zuweisen.
Egal welche Prozentangaben du den fieldsets jetzt einzelnt machst.
Die passen sich an den vorhandenen Bereich rechts neben dem Bild an.

Schöne Grüße

Alles anzeigen

Die Sache mit der Tabelle ist aber auch nicht das Wahre, vor allem, weil es wohl outdated ist.
Ich möchte ja auch die einzelnen Container per CSS gestalten.
Außerdem besteht das Problem ja nicht nur bei den Fieldsets, sondern auch bei normalen Containern.

Das Problem besteht also weiterhin.
Eine prozentuale Angabe bringt nichts.
Habe mal testweise eine neue Seite erstellt:

#logo{
	position: relative;
	margin:0 auto;
	top: 10%;
	left: 25%;
}


#main{
	position: absolute;
	margin:0 auto;
	top: 30%;
	left: 25.4%;
	width: 51%;
	background-color: white;
}

Das ist der Code, an dem muss ja irgendwas falsch sein.

Habe aktuell alles nur in Prozent angegeben und keine einzige Pixelangabe. Bei mir sieht es wunderbar aus, allerdings bei anderen nicht.
Grüße