Warum wird Seite zerschossen bei kleinen Monitoren

[NicoDeluxe]

Hallo Ihrs,

hat jemand nen Plan, warum meine Seite auf kleinen Monitoren zerschossen wird? (tonerzill a.de)

Gibts dafür irgendwas im Stylesheet, was die Seite zusammenhält oder so?

Linkback: https://www.modified-shop.org/forum/index.php?topic=22568.0

[hedon02]

".head p" + "#topmenu"  >1000px. Dadurch rutscht das "#topmenu" unterhalb ".head p" und verschiebt die leftcol nach rechts.

"#topmenuwrap" entfernen (ueberfluessig) und sauber neu stylen  .

Gruesse

[NicoDeluxe]

öhhm danke

Hab leider keine Ahnung davon und will nicht haufen Geld dafür ausgeben, heutzutage hat doch nur selten jemand ein kleinen Monitor. Kann ich das nicht selber machen irgendwie

[hedon02]

Wenn Du mir versprichst das "CSS" auch so auszuprobieren, wie ich es vorschlage, dann sag ich es Dir  .

...denn jedesmal wenn ich eine CSS-Loesung vorschlage wurde die "kreativ" ausprobiert mit entsprechendem Ergebnis und endlosen Nachfragen. 

Gruesse

[NicoDeluxe]

Das wär ja suuuuuuuuuuper nett von dir Brauchst die Stylesheet?

[piru]

heutzutage hat doch nur selten jemand ein kleinen Monitor.

Tablets, Smartphones, heutzutage haben fast alle einen kleinen Bildschirm... 

[NicoDeluxe]

ja gut, aber für mobile Geräte hab ich ne Optimierung drin

[ps]

Fürs Ipad funktioniert deine "Optimierung" nicht;
Mein schöner, kleiner Bildschirm mißt  übrigens ca. 35 x 27 cm;

Susanne

[NicoDeluxe]

Hmmmm möglicherweise wurde es nur für Android optimiert, da sollte oben eine Meldung erscheinen, dass eine mobile Version verfügbar ist, aber egal.

Deshalb möcht ich es ja optimieren, damit auch Appleverschwörer auf meiner Seite surfen können heheh

[Hobbybastler]

Hmmmm möglicherweise wurde es nur für Android optimiert, da sollte oben eine Meldung erscheinen, dass eine mobile Version verfügbar ist, aber egal.

Deshalb möcht ich es ja optimieren, damit auch Appleverschwörer auf meiner Seite surfen können heheh

Hallo NicoDeluxe

Wenn man den Verkaufszahlen glauben will, dann hat jeder schon eins, ob IPAD oder GALAXY TAB2, das sind die Kunden von Morgen und die Bringen auch Umsatz.....

gruß

[NicoDeluxe]

Ja, ich weiß, aber das Thema gleitet grad etwas ab. Ich warte noch auf ne Antwort von hedon02, er ist so nett und hilft mir. Dannach könnt ihr weitermobben

[hedon02]

Naja diese Probleme kann ich Dir jetzt nicht loesen. Ich geb dir nur eine Variante wie die bestehende Konfiguration einigermassen funktioniert.

1. Html Struktur so abaendern: (hast auch noch einen "div" Fehler, kontrollier mal die auskommentierten Codeabschnitte im Quelltext)

Code: XML  [Auswählen]

<div class="head">
  <div id="topmenuwrap">
    <p>Willkommenmessage</p>
    <ul id="topmenu">
      <li>blabla</li>
      <li>blabla</li>
    </ul>
  </div>
</div>

und das so gering wie moeglich veraenderte CSS:

Code: CSS  [Auswählen]

.head {
    background-image: url(images/headbg.jpg);
    width:100%;
    min-width:1000px; /*minimale Weite Header, wie #wrap */
}
#topmenuwrap {
    margin:0 170px 0 30px; /* Kontakt braucht Platz um nicht ueber Nav zu geraten */
    overflow:hidden; /* da alle childelemente floaten */
}
/*topmenu + head p haben nun 800px Breite zur Verfuegung*/
.head p {
    float: left;
    /*width: 430px; auf Weiten in pixel so oft wie moeglich verzichten*/
    padding-top: 15px;
    font-weight: bold;
    /*margin-left: 50px; linker Abstand ist in der #topmenuwrap das margin */
}
#topmenu {
    float: right;
    padding: 0;
    margin: 5px 0 0;
    list-style-type: none;
    height: 45px; /* 45px + margin-top 5px sind 50px fuer die Gesamthoehe des .head */
    font-size: 13px;
}

Wie immer Sicherungskopie  !

Gruss

[NicoDeluxe]

Dankkeeeee, dann wollen wir mal

[NicoDeluxe]

JAJAJAJAJAjaajajajajajaja DANKEE!!!!!!! :d

also bei mir klappts, bis auf das komische Wrapper ding aber ich hab glaube was übersehen

 

[hedon02]

"min-width" der ".head" ist falsch gescrieben bei Dir

Gruss