Mobile-Webseite hat Abstand auf der Seite

[BlackBoSs]

Hallo,

kann mir bitte wer dabei helfen.
Ich versuche derzeit eine Webseite von einem bekannten auf responsive umzustellen.
Habe aber auf der rechten Seite der Webseite einen Abstand wo ich aber den Fehler nicht finde..

Kann wer von euch die erfahren sind mir den Fehler finden bzw sagen ?

Es geht um folgende Webseite:


Liebe Grüße

 

[TPHeinz]

Moin,

zeile 137
;<span class="loading triangles"></span><span class="loading triangles"></span></span></label>

muss weg.


zeile 430 </body>

dahinter kommt noch der footer - muss davor
<footer>
<div class="box_footer">
<div class="">
<label>Renovierungs-Profi</label>
</div>
<div class="">
<a href="#kontakt">Kontakt</a>
</div>
</div>
</footer>
</html>

evtl. passt es dann schon

 

[BlackBoSs]

Vielen Dank für deine Hilfe.
Kennst du dich auch bei der Navigation aus ?

komme nicht weiter bei menubutton für mobile geräte ...

Habe folgenden Code in den headbereich geschrieben:

    <script type="text/javascript">
      $(document).ready(function () {
        $('.menubutton').click(function() {
          $('nav').slideToggle('slow');
        });

      });
    </script>

Das Problem ist es wird keine Navigation beim Klick angezeigt? es tut sich nichts ...

 

[TPHeinz]

scripte - da bin ich nicht so fit drin.

in deiner css datei steht
.mobile_navigation {
display: none;
}
das würde ich mal überprüfen

- und das Logo im Header ist in einer h1 Überschrift und das Image ist nicht responsiv.

 

[noltehans]

in deiner css datei steht
.mobile_navigation {
display: none;
}

Das ist okay.
Die Navigation soll ja erst bei Klick zu sehen sein, was bei mir mit dem Firefox auch funktioniert.

Aber die Menubar sieht man auch in der Desktopansicht.
Deshalb...

#menubar {
display: none;
}

@media (max-width: 640px) {
#menubar {
display: block;
}
}

 

[BlackBoSs]

Vielen Dank @noltehans !

Ich hatte bei media query nicht direkt auf die #menubar display:block gesetzt sondern auf #menubar ul li a.menubutton

Jetzt funktioniert es super.

 

[noltehans]

Schön das es funktioniert hat.

Du musst unbedingt deine Bilder noch optimieren und GZip, Keep-Alive, Caching aktivieren.

 

[BlackBoSs]

Was ist GZip, Keep-Alive ?

 

[Mediaoase]

GZip ist ein Komprimierungsverfahren. Keep Alive sorgt dafür, dass nicht für jede http Anfrage eine neue Verbindung aufgebaut wird, sondern die Verbindung erhalten bleibt.

Beides sind Optimierungsverfahren, die üblicherweise in der .htaccess oder in den config files des Webserver Moduls eingestellt werden.