# Automatische anpassung der Größe / Auflösung



## djsubotage (12. April 2005)

Hallo, ich bin momentan dabei, eine Homepage auf PHP-Basis zu "basteln" - möchte jetzt gerne noch, das sich diese Homepage automatisch der jeweiligen Auflösung des Betrachters anpasst. (Beispiel-Seite) 

Wie kann ich das machen (ggf. kurze Erklärung oder Quelltextauszüge)

Danke!


----------



## Gudy (12. April 2005)

Moin.....

also du kannst die Auflösungen abfragen und dann auf eine passende Seite weiterleiten, macht aber viel arbeit.

Es gibt ein Modul für Webserver das auch alles können soll, frag mich aber bitte nicht nach dem Namen...


----------



## djsubotage (12. April 2005)

Besteht die Möglichkeit, sowas mit CSS (o.ä.) zu machen 

Am besten so einfach wie möglich    - aber das wollen ja alle!


----------



## Dr Dau (12. April 2005)

Hallo!

Dass geht mit JavaScript, ich meine "resize to" nennt sich dass.
Ich würde aber auf JavaScript verzichten, siehe hierzu dein Menü.
Da ist dann der schöne "onMouseOver" Effekt futsch. Diese würde ich lieber versuchen mit CSS (a:hover) umzusetzen. Ausserdem würde ich die CSS-Anweisungen auch in eine externe CSS-Datei auslagern.
Was die Auflösung betrifft, kannst Du die einzelnen Elemente in DIV-Boxen setzen und diese entsprenchend positionieren.
Menü = links oben (feste Grösse)
Logo-Bild = rechts oben (feste Grösse)
Anschriften-Bild = rechts oben + rechts unten (Abstand oben z.b. 200px, feste Breite, für die Höhe in 3 Teile aufteilen, Höhe für das Mittelteil variabel)
Seiteninhalt = links oben (Abstand oben z.b. 200px, Breite und Höhe variabel)
blaue Trennlinie = als separates Bild (Breite variabel)
So sollte der Inhalt über die ganze Browserbreite angezeigt werden.
Oder du macht den ganzen Kram in eine Tabelle, davon halten hier aber viele Leute nichts.
Ich weiss ja nicht wie der Rest der Seite aussehen soll. Aber so wie es jetzt aussieht, würde ich Tabellen bevorzugen

Gruss Dr Dau


----------



## DjMG (12. April 2005)

Hi !

Jap ich hab auch sowas auf meiner Page.
Hier leitet ein Javascript auf die richtige .css Datei weiter.

Auszug:

```
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Unbenanntes Dokument</title>
<link rel="stylesheet" href="1024x768.css" type="text/css" title="1024x768" media="screen, projection" />
<script language="JavaScript" type="text/javascript">
<!--
if (screen.width <= 800)
document.write('<link rel="stylesheet" href="800x600.css" type="text/css">'); 
if (screen.width > 800 && screen.width < 1024)
document.write('<link rel="stylesheet" href="1024x768.css" type="text/css">');
if (screen.width >= 1024)
document.write('<link rel="stylesheet" href="1024x768.css" type="text/css">');
if (screen.width >= 1152)
document.write('<link rel="stylesheet" href="1152x864.css" type="text/css">');
 
if (screen.width >= 1280)
document.write('<link rel="stylesheet" href="1280x1024.css" type="text/css">');
 
//-->
</script>
</head>
<body>
[......]
```
 
Meine Seite, wenn du's probieren willst: http://djmg.dj.funpic.de/ 
Du musst dir aber klar sein, dass das nur funktioniert, wenn der User
JavaScript aktiviert hat - ich hab als alternative noch nen manuellen .php switcher
der auch die .css verändert. (funktioniert gerade nicht, weil datei .html und nicht .php heißt -.- )

Mit freundlichem Gruß
DjMG


----------



## Gumbo (12. April 2005)

Bitte keine JavaScript-Lösung. Probier mal Folgendes:
	
	
	



```
<body>
<div id="container">
	[…]
</div>
</body>
```


```
body {
	text-align:			center;
}
#container {
	margin:				0 auto;
	width:				[…];
	text-align:			left;
}
```


----------

