HTML - Fenster richtig positionieren

damomo3392

Cadet 4th Year
Dabei seit
Aug. 2010
Beiträge
87
Hallo, wie schon aus einem anderem Thread zu entnehmen, beschäftige ich mich seit kurzer Zeit mit HTML und CSS. Ich habe mal Testweise jetzt versucht, eine Seite zu erstellen, was so weit kein Problem war.

Diverse Boxen habe ich mit Hilfe von "div" festgelegt und über den Befehl "Absolute" positioniert - Einheit Pixel. Wenn ich jetzt jedoch die Größe meines Browserfensters ändere, passt alles ganz und gar nicht mehr.

Mit welchem Befehl bleiben die Elemente alle an ihrer Stelle, auch wenn ich das Fenster verkleinere?
 

DHundt

Cadet 4th Year
Dabei seit
Jan. 2013
Beiträge
106
Mahlzeit,

poste doch einfach mal einen Link zu deiner Seite.
Ohne Quelltext lässt sich das schwer abschätzen.

Absolut positionierte Elemente beziehen sich immer auf das erste relativ positionierte Parent-Element bzw. den BODY
und sind nur in Ausnahmefällen sinnvoll.

Gruß
 

Lavaground

Lt. Commander
Dabei seit
Dez. 2006
Beiträge
1.146
die positionierung kann absolut am rand fetgelegt werden, nur sollten dann die maße der boxen prozentual festgelegt werden, damit sie sich der größe des browsers anpassen. ansonsten wie oben genannt: responsive desgin, heißt soviel wie: hat der browser x pixel in der breite, benutze entsprechende css einträge für x, d.h. es ist nicht unbedingt 100% dynamisch, sondern reagiert auf bestimmte gegebenheiten.
 

damomo3392

Cadet 4th Year
Ersteller dieses Themas
Dabei seit
Aug. 2010
Beiträge
87
Beispiel:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Titel</title>

<link rel="stylesheet" type="text/css" href="../CSS/Layout.css" />
</head>

<body>
<p>Testdkfprkmflodmmgfkopmcgföpc,mlo oekfo opkfmo mdfmo40i9fjdvpfm 3e9jiofdmf o4jfodfm e0ujr90wjapdomlc 903ujfsopdmpmf 49jed0pmfespjfsdm p4r9ejfmndso 93rnsmd0sdfuijn43ei90or4i9jioefkopsfdsfdsfdsfdsfdsfdjlsfdsfdsfdsfd90ß30ijeo340ju243rfijdewijhfioesjdnolaknfigjnoslnd3298urfs8u90j90jmnrelksmlmcoldewgfesffd</p>
</body>

</html>
CSS:
Code:
html {
	background-color: white;
	width: 100%;}

body {
	background-color: black;
	width: 80%;
	margin: 10px auto;}
Wenn ich jetzt die größe meines Browserfensters verändere und zur Seite schieben, verschiebt sich der Text nach unten, um alles noch im Fenster darzustellen - Das soller aber nicht, alles soll so positioniert bleiben wie im "Vollbildmodus"
 

DHundt

Cadet 4th Year
Dabei seit
Jan. 2013
Beiträge
106
Wenn du eine feste Breite möchtest, solltest du diese auch einstellen ;-)
100% = 100% der verfügbaren Breite

Du müsstest statt den % Angaben einen festen px Wert einstellen (entsprechend deiner Bildschirm-Breite).

Dass das ganze nicht besonders toll ist, da es verschiedene Bildschirmgrößen und -auflösungen gibt,
muss ich dir ja sicherlich nicht sagen ;-)
 

palace4d

Lt. Commander
Dabei seit
Okt. 2007
Beiträge
1.179
CSS + feste größen
Code:
p {
white-space: nowrap;
}
Geht ab IE8 und natürlich in modernen Browsern wie Firefox, Opera, Chrome, Safari und IE9+

Jubel #1000 ... darauf ein Ur-Krostitzer :schluck:
 
Zuletzt bearbeitet:

damomo3392

Cadet 4th Year
Ersteller dieses Themas
Dabei seit
Aug. 2010
Beiträge
87
Glückwunsch zum 1000sten ;-)

Fehler behoben - Ich die Angabe in Pixeln kann natürlich nicht richtig klappen (Klarer Fehler von mir) - Zudem habe ich im Vorfeld jetzt noch im CSS die Mindestgröße der Seite über Min-height/width definiert
 
Top