header, main und sidebar mit automatischer Größenanpassung

Hallo zusammen,

ich möchte gerne eine einfache index.html erstellen welche drei Bereiche hat:

Header: mit banner / adsense
Main: mit einem kurzen text
Sidebar (rechts): mit einem banner seitlich von dem ganzen

Das Alles sollte aber von den Maßen/Größen automatisch an angepasst werden sodass sowohl ein Besucher mit dem Handy als auch jemand der vom PC aus die Website öffnet, eine richtige Darstellung bekommt.

Ich habe dafür ein Beispiel erstellt, allerdings wird dort alles bunt gemischt sobald man das ganze am Handy öffnet (da eben die größen, maße und positionen nicht zu der Handyauflösung passt?):
[URL entfernt]

Kann mir hier jemand weiterhelfen?

Danke !

Zitat von Basi

Hallo.

Bitte erstelle dein Beispiel für uns ohne Werbung.

Außerdem ist nicht ganz klar, was genau du erreichen möchtest.

Stchworte die du suchst sind zum Beispiel Viewport und Media Queries.

Alles anzeigen

Hmm dadurch das adsense auch automatisch skaliert weiß ich jetzt nicht genau wie ich das im beispiel am besten erreiche?

Was ich letzt endlich machen möchte:

- Eine einfache index.html mit drei bereichen welche je nach bildschirm größe (laptop, smartphone,... ) automatisch und richtig skaliert:
- Header mit Adsense banner
- Mittiger Content mit zwei Zeilen Text
- Rechts davon ein weiteres Feld mit einem Banner der von oben bis unten geht.

Ein kurzes beispiel:
[Blockierte Grafik: http://files.bestmail.ws/linux/index-beispiel.jpg]

Danke für deine beiden links, ich versuche gerade damit zu arbeiten aber so wirklich komme ich nicht auf das richtige endergebniss hin:
http://files.bestmail.ws/linux/index3.html