• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Webseiten für Smartphones

C

Christian14

Neues Mitglied
Hallo,

ich versuche verzweifelt, eine Webseite für Smartphones zu erstellen, die auch noch auf allen gängigen Browsern gleich aussieht.

im Augenblick sieht das so aus:
In Chrome soweit ganz OK:
02.png


im Samsung-Browser viel zu klein:
03.png


und in Firefox zum Davonlaufen:
01.png

Dabei sind beie Textteile über ein Stylesheet völlig identisch formatiert.

Liegt das jetzt an mir, oder interpretiert tatsächlich jeder Browser ein und dieselbe Webseite so unterschiedlich?
Gibt es dafür auch eine Lösung, oder muss ich tatsächlich drei verschiedene Webseiten schreiben, um die Macken der Browser auszubügeln?

Gruß

Christian
 
Gibt es dafür auch eine Lösung, oder muss ich tatsächlich drei verschiedene Webseiten schreiben, um die Macken der Browser auszubügeln?
Zum Vergrößern anklicken....
Nein, musst du nicht.

Nimm am besten Bootstrap dafür. Ansonsten würde uns ein Einblick in deinen Quellcode weiterhelfen.
 
Hallo,

in Systeme wie Bootstrap möchte ich mich ungern einarbeiten, ich programmiere lieber zu Fuß auf unterem Niveau. Auch der Quellcode ist nichts Besonderes.
htm:
Code: 
<html>

<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>Theatergruppe Zick-Zack</title>
</head>

<link rel="stylesheet" type="text/css" href="style.css">

<table>
    <tr>
        <td>
            <p>
                <img src="../images/Logo_mobile.png"><br>
                Herzlich willkommen bei der Laientheatergruppe Zick-Zack aus Goch-Pfalzdorf. <br><br>
            </p>
        </td>
    </tr>
    <tr>
        <td>
            <p>
                  Veranstalter: KulTOURbühne Goch
              </p>
              <p>
                  Kartenvorverkauf beginnt in Kürze
              </p>
              <p>
                  Weitere Vorstellungen sind in Vorbereitung.
              </p>
          </td>
    </tr>
    <tr>
        <td>
           
            <p>
                Eine strenge Witwe lebt mit ihren beiden Töchtern in einem kleinen beschaulichen Dorf. Die beiden Töchter sind so unterschiedlich, wie sie es nur
                sein können. Liesel ist ein fleißiges, freundliches Kind, wohingegen Berta faul, eingebildet und frech ist. <br><br>
                Eines Tages fällt der fleißigen Liesel beim Spinnen ihre Spule in einen Brunnen. <br>
            </p>
<b><a href="../Aktuell_Inhalt.htm">&nbsp;weiterlesen</a></b>
            </p>

        <p>&nbsp;</td>
        </tr>
    </table>

</body>
</html>

und das Stylesheet:

Code: 
p
{
    color: black;
    font-family: Verdana;
    font-size: 12px;
    text-align: justify;
    hyphens: auto;
}

table
{
    width: 99%;
    border-style: none;
    border-collapse: collapse;
}

td                                                       
{
    width: 100%;
    border-style: solid;
    border-width: 1px;
    border-color: #004080;
}

Gruß

Christian
 
Christian14 schrieb:
Hallo,

in Systeme wie Bootstrap möchte ich mich ungern einarbeiten, ich programmiere lieber zu Fuß auf unterem Niveau.
Zum Vergrößern anklicken....

Damit wirst du auf Smartphones nicht mal eine funktionierende Navigation hinbekommen. Den obigen Code kannst du komplett löschen. Mit Tabellenlayout und ohne Media Queries lassen sich keine responsiven Seiten für unterschiedliche Geräteauflösungen erstellen. Zumindest keine, die vernünftig aussehen sollen.
 
Wie Tronjer schon sagt sind Tabellenlayouts vom letzten Jahrhundert und schon lange abgeschafft.
 
Schade eigentlich, dann kann ich die mobile Webseite wohl vergessen. Eigentlich verlange ich von den Smartphone-Browsern ja nicht mehr, als dass eine Schriftgröße 12 auch als Schriftgröße 12 angezeigt wird. Das klappt bei verschiedenen PC-Browsern ja schließlich auch.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben