Hi Leute, ich versuche gerade eine Seite in Responsive Design zu schreiben. Grundsätzlich funktioniert sie ja schon. Nur jetzt hab ich das Problem mit der Schriftgröße. Gesetzt wird sie mit font-size: 7vh; Schau ich sie mir am Handy an Galaxy s4 mini passt die Schriftgröße auch die Platzierung der Elemente, wenn ich es mir am Galaxy a5 anschaue passt die Platzierung nicht mehr, gleich beim Sony. Auf IPhone 4-6 passt wiederum alles. Hier die Links zum besseren Verständnis: [benwillgruber.com/stefanseite/test/galaxy_s4_mini.png](http://benwillgruber.com/stefanseite/test/galaxy_s4_mini.png) --> alles ok [benwillgruber.com/stefanseite/test/google_nexus_10_emulator.png](http://benwillgruber.com/stefanseite/test/google_nexus_10_emulator.png) --> alles ok [benwillgruber.com/stefanseite/test/wrong_galaxy_a5.jpg](http://benwillgruber.com/stefanseite/test/wrong_galaxy_a5.jpg) --> Falsche Darstellung [benwillgruber.com/stefanseite/test/sony_xperia_z2.jpg](http://benwillgruber.com/stefanseite/test/sony_xperia_z2.jpg) Kann mir bitte einer helfen und mir erklären wie es zu den unterschieldichen Darstellungen kommt? Danke ~~~css CSS: * { box-sizing: border-box;} body { background-color: #3C3C3B; /* Dunkel Grau */ padding: 0px; margin: 0px; overflow: hidden; width: 100vw; } #benjaminwillgruber { float: left; width: 50%; height: 16vh; padding-left: 10px; overflow: hidden; border: 1px solid #ff0000; } #benjamin { font-size: 7vh; color: #ffffff; } #willgruber { font-size: 7vh; color: #ffffff; } ~~~ ~~~html HTML: <div id = 'benjaminwillgruber'> <div id = 'benjamin'> <font style = "font-family: 'avril'">Benjamin</font> </div> <div id = 'willgruber'> <font style = "font-family: 'avril'">Willgruber</font> </div> </div> ~~~

Hi Leute, ich versuche gerade eine Seite in Responsive Design zu schreiben. Grundsätzlich funktioniert sie ja schon. Nur jetzt hab ich das Problem mit der Schriftgröße. Gesetzt wird sie mit font-size: 7vh; Schau ich sie mir am Handy an Galaxy s4 mini passt die Schriftgröße auch die Platzierung der Elemente, wenn ich es mir am Galaxy a5 anschaue passt die Platzierung nicht mehr, gleich beim Sony. Auf IPhone 4-6 passt wiederum alles. Hier die Links zum besseren Verständnis: [benwillgruber.com/stefanseite/test/galaxy_s4_mini.png](http://benwillgruber.com/stefanseite/test/galaxy_s4_mini.png) --> alles ok [benwillgruber.com/stefanseite/test/google_nexus_10_emulator.png](http://benwillgruber.com/stefanseite/test/google_nexus_10_emulator.png) --> alles ok [benwillgruber.com/stefanseite/test/wrong_galaxy_a5.jpg](http://benwillgruber.com/stefanseite/test/wrong_galaxy_a5.jpg) --> Falsche Darstellung [benwillgruber.com/stefanseite/test/sony_xperia_z2.jpg](http://benwillgruber.com/stefanseite/test/sony_xperia_z2.jpg) Kann mir bitte einer helfen und mir erklären wie es zu den unterschieldichen Darstellungen kommt? Danke ~~~css CSS: * { box-sizing: border-box;} body { background-color: #3C3C3B; /* Dunkel Grau */ padding: 0px; margin: 0px; overflow: hidden; width: 100vw; } #benjaminwillgruber { float: left; width: 50%; height: 16vh; padding-left: 10px; overflow: hidden; border: 1px solid #ff0000; } #benjamin { font-size: 7vh; color: #ffffff; } #willgruber { font-size: 7vh; color: #ffffff; } ~~~ ~~~html HTML: <div id = 'benjaminwillgruber'> <div id = 'benjamin'> <font style = "font-family: 'avril'">Benjamin</font> </div> <div id = 'willgruber'> <font style = "font-family: 'avril'">Willgruber</font> </div> </div> ~~~

Hi Leute, ich versuche gerade eine Seite in Responsive Design zu schreiben. Grundsätzlich funktioniert sie ja schon. Nur jetzt hab ich das Problem mit der Schriftgröße. Gesetzt wird sie mit font-size: 7vh; Schau ich sie mir am Handy an Galaxy s4 mini passt die Schriftgröße auch die Platzierung der Elemente, wenn ich es mir am Galaxy a5 anschaue passt die Platzierung nicht mehr, gleich beim Sony. Auf IPhone 4-6 passt wiederum alles. Hier die Links zum besseren Verständnis: [benwillgruber.com/stefanseite/test/galaxy_s4_mini.png](benwillgruber.com/stefanseite/test/galaxy_s4_mini.png) --> alles ok [benwillgruber.com/stefanseite/test/google_nexus_10_emulator.png](benwillgruber.com/stefanseite/test/google_nexus_10_emulator.png) --> alles ok [benwillgruber.com/stefanseite/test/wrong_galaxy_a5.jpg](benwillgruber.com/stefanseite/test/wrong_galaxy_a5.jpg) --> Falsche Darstellung [benwillgruber.com/stefanseite/test/sony_xperia_z2.jpg](benwillgruber.com/stefanseite/test/sony_xperia_z2.jpg) Kann mir bitte einer helfen und mir erklären wie es zu den unterschieldichen Darstellungen kommt? Danke ~~~css CSS: * { box-sizing: border-box;} body { background-color: #3C3C3B; /* Dunkel Grau */ padding: 0px; margin: 0px; overflow: hidden; width: 100vw; } #benjaminwillgruber { float: left; width: 50%; height: 16vh; padding-left: 10px; overflow: hidden; border: 1px solid #ff0000; } #benjamin { font-size: 7vh; color: #ffffff; } #willgruber { font-size: 7vh; color: #ffffff; } ~~~ ~~~html HTML: <div id = 'benjaminwillgruber'> <div id = 'benjamin'> <font style = "font-family: 'avril'">Benjamin</font> </div> <div id = 'willgruber'> <font style = "font-family: 'avril'">Willgruber</font> </div> </div> ~~~

Hi Leute, ich versuche gerade eine Seite in Responsive Design zu schreiben. Grundsätzlich funktioniert sie ja schon. Nur jetzt hab ich das Problem mit der Schriftgröße. Gesetzt wird sie mit font-size: 7vh; Schau ich sie mir am Handy an Galaxy s4 mini passt die Schriftgröße auch die Platzierung der Elemente, wenn ich es mir am Galaxy a5 anschaue passt die Platzierung nicht mehr, gleich beim Sony. Auf IPhone 4-6 passt wiederum alles. Hier die Links zum besseren Verständnis: benwillgruber.com/stefanseite/test/galaxy_s4_mini.png --> alles ok benwillgruber.com/stefanseite/test/google_nexus_10_emulator.png --> alles ok benwillgruber.com/stefanseite/test/wrong_galaxy_a5.jpg --> Falsche Darstellung benwillgruber.com/stefanseite/test/sony_xperia_z2.jpg Kann mir bitte einer helfen und mir erklären wie es zu den unterschieldichen Darstellungen kommt? Danke ~~~css CSS: * { box-sizing: border-box;} body { background-color: #3C3C3B; /* Dunkel Grau */ padding: 0px; margin: 0px; overflow: hidden; width: 100vw; } #benjaminwillgruber { float: left; width: 50%; height: 16vh; padding-left: 10px; overflow: hidden; border: 1px solid #ff0000; } #benjamin { font-size: 7vh; color: #ffffff; } #willgruber { font-size: 7vh; color: #ffffff; } ~~~ ~~~html HTML: <div id = 'benjaminwillgruber'> <div id = 'benjamin'> <font style = "font-family: 'avril'">Benjamin</font> </div> <div id = 'willgruber'> <font style = "font-family: 'avril'">Willgruber</font> </div> </div> ~~~