[CSS] Un aiuto per migliorare una pagina

[Gigabyte2]

Salve a tutti, ho un sito legato alla mia stazione meteo dove, ogni due minuti, vengono aggiornati i dati. Ho voluto creare anche una pagina con i contenuti ottimizzati per gli smartphone.
La pagina, tuttavia, non riesco a visualizzarla correttamente..vorrei che si adattasse alla larghezza e all'altezza delle pagine e che sia fruibile anche il landscape (con uno stile diverso, ma quello dopo).

Vi posto la pagina e il file css, se mi potete dare un consiglio ve ne sarei grato :)

http://meteobibbiena.gigabyte2.it/iPhone.htm
http://meteobibbiena.gigabyte2.it/iphone.css

[Gigabyte2]

Sono riuscito a cambiare stile al ruotare dello schermo (landscape e portrait), ma non riesco ad adattare il contenuto alla grandezza della pagina...consigli?

[wingman87]

Esattamente il problema qual è? Cosa vorresti ottenere?
Io allargherei il contenuto al 100%, inoltre più che i testi linkerei i rettangoli che li contengono. Inoltre mettendo il contenitore in "position:fixed" la pagina non è scrollabile.

EDIT: usavo firefox per vedere la pagina ed aveva un sacco di problemi, invece con chrome sembra funzionare quasi bene... Vedo che hai usato un po' di proprietà del tipo -webkit-*, per rendere il sito più portabile dovresti aggiungere anche le corrispondenti proprietà css3 e -ms-*.