Forum Doku Wiki Blog

Forumsarchiv 2009, November
CSS für mobile geräte

archivierte Beiträge lesen

  1. (CSS) CSS für mobile geräte von dobardan, 24. 11. 2009, 20:49

CSS für mobile geräte

Der folgende Beitrag wurde am 24. 11. 2009, 20:49 Uhr von dobardan veröffentlicht.


<style type="text/css"/>
@media handheld {
body { background-color:#000000;
      }

#table {
width:300px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:16px;
}

#localcopy {
width:300px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:13px;
}

.localcopy_1 {
color:#cccccc;
font-size:20px;
font-family:Verdana, Arial, Helvetica, sans-serif;
}

#header {
width:246px;
height:87px;
color:#ffffff; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:9px; background-color:#cccccc;
}

.bild {
width:246px;
height:87px;
}

#copy_main{
width:254px;
font-family:Verdana, Arial, Helvetica, sans-serif; font-size:13px; color:#ffffff; margin-left:20px; background-color:#000000;
}

#right_col {
width:60px;
}

}

@media screen {
body { background-color:#000000;
      }

#table {
width:598px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
}

#localcopy {
width:560px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
}

.localcopy_1 {
color:#cccccc;
font-size:9px;
font-family:Verdana, Arial, Helvetica, sans-serif;
}

#header {
width:560px;
height:198px;
color:#ffffff; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:9px; background-color:#cccccc;
}

.bild {
width:560px;
height:198px;
}

#copy_main{
width:380px;
font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; color:#ffffff; margin-left:20px; background-color:#000000;
}

#right_col {
width:184px;
}

.blid {
width:560px;
height:198px;
}

}

</style>


Hi,
ich habe die oben geschriebene css coding in my html template eingebaut.
aber auf dem Handy nimmt diese formatierung nicht.
Z.B.
Das Bild soll bei normal browser 560 x 198 aber auf dem handy soll 284 x 87. Das funktioniert nicht.

Vielen Dank
Mvg

CSS für mobile geräte

Der folgende Beitrag wurde am 24. 11. 2009, 20:53 Uhr von LX veröffentlicht.

Ich mutmaße jetzt mal, dass screen auch beim Handy zutrifft und daher der letzte Selektor ebenfalls zutrifft.

Endweder stattest Du den ersten Selektor mit höherer Spezifität aus oder änderst die Reihenfolge von screen und mobile.

Ein weiteres Problem könnte darin bestehen, dass der Browser Deines Handys das mobile-CSS ignoriert - das kannst Du jedoch leicht testen.

Gruß, LX
--
RFC 1925, Satz 6a: Es ist immer möglich, einen weiteren Umweg einzufügen.
RFC 1925, Satz 11a: Siehe Regel 6a

CSS für mobile geräte

Der folgende Beitrag wurde am 24. 11. 2009, 22:08 Uhr von dobardan veröffentlicht.

> Ich mutmaße jetzt mal, dass screen auch beim Handy zutrifft und daher der letzte Selektor ebenfalls zutrifft.
>
> Endweder stattest Du den ersten Selektor mit höherer Spezifität aus oder änderst die Reihenfolge von screen und mobile.
>
> Ein weiteres Problem könnte darin bestehen, dass der Browser Deines Handys das mobile-CSS ignoriert - das kannst Du jedoch leicht testen.
>
> Gruß, LX

Hi LX,

vielen Dank für die rasche Hilfe. Ist media=handheld ist nicht für Mobile Geräte? Ich habe auch die Rheinfolge geändert aber es funktioniret nicht.

Danke
mvg

CSS für mobile geräte

Der folgende Beitrag wurde am 25. 11. 2009, 09:31 Uhr von Gunnar Bittersmann veröffentlicht.

@@dobardan:

nuqneH

> Ist media=handheld ist nicht für Mobile Geräte?

Ja. Aber was gehen die Hersteller mobiler Webclients die Specs des W3C an?

Siehe A List Apart: Return of the Mobile Stylesheet.

Qapla'
--
Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)

© 1998-2013 SELFHTMLImpressumSoftware: Classic Forum 3.4