Auf Thema antworten

Beitrag

[QUOTE="meinereiner7, post: 13580, member: 4645"]
Hallo,

ich könnte mal eure Hilfe brauchen.
Diese Homepage ist von mir. Läuft soweit gut, doch jetzt ist mir aufgefallen, das die Startseite auf allen mobilen Geräten nur stark verkleinert startet und dann erst nach Doppelklick in den Vollbildschirm wechselt.
Ich komme momentan nicht auf den Fehler, vielleicht kann mir irgendwer weiterhelfen. Hier der Code:

Index-Seite
[CODE=html]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Schreinerei Horst Guggenberger</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<meta name="author" content="Horst Guggenberger">
<meta name="publisher" content="Horst Guggenberger">
<meta name="copyright" content="Horst Guggenberger">
<meta name="description" content="Herzlich Willkommen bei der Schreinerei Horst Guggenberger. Schreinerei Horst Guggenberger Birket 8 Tel: 08774/1565 Fax: 08774/969820 e-mail: h.guggenberger@gmx.de.">
<meta name="keywords" content="Schreinerei, Horst, Guggenberger, Birket, Tischler, Holz, Schreiner, Möbel, nach, Maß, ">
<meta name="page-topic" content="Bauen Wohnen">
<meta http-equiv="content-language" content="de">

</head>
<body>

<h1> Schreinerei Horst Guggenberger</h1>

</div>

</div>

<div id="navi">
<table border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td><a href="index.html">Home</a></td>
    <td><a href="ueberuns.html">Über uns</a></td>
    <td><a href="philosophie.html">Philosophie</a></td>
    <td><a href="moebel.html">Möbel und Einrichtungen</a></td>
    <td><a href="kontakt.html">Kontakt</a></td>
    <td><a href="impressum.html">Impressum & Datenschutzerklärung</a></td>

</tr>
</table>
     </div>

<div id="inhalt">
<h1>Herzlich Willkommen<br>

bei der Schreinerei Horst Guggenberger</h1><br>
</div>
<br><br><br>

Schreinerei Horst Guggenberger&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

Birket 8&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      
          Tel: 08774/1565&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          Fax: 08774/969820&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
         &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

e-mail:&nbsp;<a href="mailto:h.guggenberger@gmx.de">h.guggenberger@gmx.de</a>

</div>

</div>
</div>
</body>
</html>[/CODE]

style.css

[CODE=css]img {max-width: 100%; height: auto;}

body       
{

font-family: Calibri, Candara, Segoe, Segoe UI, Optima, Arial, sans-serif;
margin: 0
}

/* allgemeine Linkformatierung Textbereich und Fußende*/

a:link, a:active, a:visited
{
color: #333;
text-decoration: underline     
}
a:hover
{
text-decoration: none;
color: #999     
}

/* Rahmen für Grafiken allgemein */
img
{
border: 0
}

/* Formatierung Foto oben Schreinerei*/

#logo   
{

margin: 0;
background-image: url('../images/fotooben.jpg');
background-size: cover;
background-repeat: none;
background-position: center;

height: 55%;
}

/* Text im Bild oben Schreinerei Horst Guggenberger*/

#logoname   
{

margin: 0;
padding-top: 1em;
font-size: 2em;
font-weight: bold;
color: orange;
text-shadow: 3px 3px 0px black;
letter-spacing: 0.3em;

}
/* Navigation */
#navi
{
background-image: url('../images/navi_hover.gif');
background-repeat: repeat-x;
background-color: #ccc;
color: #333;

}

/* Navi Tabelle Formatierung Größe usw. Home, Über uns, Möbel und Einrichtungen */
#navi table
{
border-collapse: collapse;
table-layout: auto;
width: 80%;
line-height: 2.5em;
}
#navi td
{
text-align: center;
border: 1px solid #999;
}

/* Schriftart, Größe der Navigationstabelle */

#navi a
{
background-image: url('../images/navi.gif');
background-repeat: repeat-x;
color: #fff;
text-decoration: none;
font-size: 1em;
display: block;
}
#navi a:hover
{
background-image: url('../images/navi_hover.gif');
color: #000
}

/* Inhalt Hintergrund */
#inhalt   
{

border: 1px solid #000;
background-color: #fff;
background-image: url('../images/inhalt.gif');
background-repeat: repeat-x;
width: 70%;
text-align: center;
opacity: 1.0;
}

/* Überschriften und Absatz */
#inhalt h1
{         
font-size: 2em;
color: #666;
text-align: center;

}
#inhalt h2
{         
font-size: 1.5em;
text-align: center;

}

/* Hauptrahmen */
#rahmen     
{
background-image: url('../images/bg.gif');
background-repeat: repeat;
background-position: center;
background-attachment:fixed;

}

/* Footer */
#footer
{
background-color: grey;

line-height: 6.26em;
color: #333;
font-size: 1.2em;
  width: 100%;
position: fixed;
  bottom: 0px;

}

Und die Animation.css
#animat{
z-index:999;

animation: logo linear 6s;
  animation-iteration-count: 1;
  transform-origin: 50% 50%;
  animation-fill-mode:forwards; /*when the spec is finished*/

-webkit-animation: logo linear 6s;
  -webkit-animation-iteration-count: 1;
  -webkit-transform-origin: 50% 50%;
  -webkit-animation-fill-mode:forwards; /*Chrome 16+, Safari 4+*/

-moz-animation: logo linear 6s;
  -moz-animation-iteration-count: 1;
  -moz-transform-origin: 50% 50%;
  -moz-animation-fill-mode:forwards; /*FF 5+*/

-o-animation: logo linear 6s;
  -o-animation-iteration-count: 1;
  -o-transform-origin: 50% 50%;
  -o-animation-fill-mode:forwards; /*Not implemented yet*/

-ms-animation: logo linear 6s;
  -ms-animation-iteration-count: 1;
  -ms-transform-origin: 50% 50%;
  -ms-animation-fill-mode:forwards; /*IE 10+*/

}

@keyframes logo{
  0% {
    transform:  translate(40%,50px)  rotate(0deg) ;
  }
  100% {
    transform:  translate(-40%,50px)  rotate(360deg) ;
  }
}

@-moz-keyframes logo{
  0% {
    -moz-transform:  translate(40%,50px)  rotate(0deg) ;
  }
  100% {
    -moz-transform:  translate(-40%,50px)  rotate(360deg) ;
  }
}

@-webkit-keyframes logo {
  0% {
    -webkit-transform:  translate(40%,50px)  rotate(0deg) ;
  }
  100% {
    -webkit-transform:  translate(-40%,50px)  rotate(360deg) ;
  }
}

@-o-keyframes logo {
  0% {
    -o-transform:  translate(40%,50px)  rotate(0deg) ;
  }
  100% {
    -o-transform:  translate(-40%,50px)  rotate(360deg) ;
  }
}

@-ms-keyframes logo {
  0% {
    -ms-transform:  translate(40%,50px)  rotate(0deg) ;
  }
  100% {
    -ms-transform:  translate(-40%,50px)  rotate(360deg) ;
  }
}[/CODE]

Die Cockie CSS hat keinen Einfluss, da ich die erst heute eingebaut habe und es schon vorher nicht funktioniert hat.

Bin für jeden Tipp dankbar.

Vielen Dank im voraus für eure Mühen

Mfg
[/QUOTE]

Authentifizierung