kostenloser Webspace werbefrei: lima-city


bilderbox mit maximaler höhe, danach zentriert darstellen

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    sonok

    Moderator Kostenloser Webspace von sonok

    sonok hat kostenlosen Webspace.

    Hallo!

    Ich bastel gerade ein einer kleinen Seite.

    Da soll beim Besuchen eine Auswahl an Bildern angezeigt werden, die der Besucher anklicken kann. Diese Bilder sollen immer vollständig zu sehen sein. Danach kommt Text.
    Die Bilder hab ich mit % nach links, % nach oben und % breite sehr fest definiert (orientiert sich an der Druckversion).

    Im Hochformat klappt das alles super. Wenn aber das Fenster ins Breitformat geht, dann schaffe ich es nicht, daß die Anzeige aller Bilder bei 100% stoppt und zentriert wird. Dh die Bilder wandern nach unten Weg.

    http://www.hgb-leipzig.de/~sonok/hp_rundgang_2017/

    Weiß da wer Rat?

    Ich hab versucht, ein div mit max-height drumrum zu basteln, das schlug aber fehl, da haben sich alle Bilder in der linken oberen Ecke versammelt.

    Danke und Grüße :)

    edit:
    Auf Javascript will ich verzichten.

    Beitrag zuletzt geändert: 12.7.2017 7:24:12 von sonok
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. tempel-des-offler

    Kostenloser Webspace von tempel-des-offler

    tempel-des-offler hat kostenlosen Webspace.

    "Die Bilder hab ich mit % nach links, % nach oben und % breite sehr fest definiert" - und da liegt meiner Meinung das Problem, falls ich es richtig verstanden habe. Mal hast Du einen Bildschirm von 1024x768 (Breitformat) wo dann über % der Breite die Bilddarstellungshöhe in manchen Fällen natürlich zu hoch wird, während bei 768x1024 natürlich alles perfekt klappt. Wenn Dir das komplette Bild innerhalb des Bildschirms wichtig ist, solltest Du also die Bildhöhe als Maß verwenden und das Bild zentriert ausgeben.

    Zu zentrierter Ausgabe habe ich für CSS folgendes gefunden: http://www.ich-lerne-css.de/Style/Examples/007/center.html#block oder eben per html vielleicht als Tabelle.

    Beitrag zuletzt geändert: 12.7.2017 9:20:27 von tempel-des-offler
  4. mein-wunschname

    mein-wunschname hat kostenlosen Webspace.

    Wenn ich das richtig sehe, dann hast du die einzelnen Parameter für #img_00 usw. akribisch per Hand ermittelt.

    Ich würde an deiner mal probieren, ob es nicht am einfachsten wäre, analog die Parameter für das Querformat zu ermitteln und diese dann in einen CSS-Abschnitt mit

    @media (orientation: landscape) { 
    ...
    ...
     }


    zu stecken.
  5. Autor dieses Themas

    sonok

    Moderator Kostenloser Webspace von sonok

    sonok hat kostenlosen Webspace.

    mein-wunschname schrieb:
    Wenn ich das richtig sehe, dann hast du die einzelnen Parameter für #img_00 usw. akribisch per Hand ermittelt.

    Ich würde an deiner mal probieren, ob es nicht am einfachsten wäre, analog die Parameter für das Querformat zu ermitteln und diese dann in einen CSS-Abschnitt mit

    @media (orientation: landscape) { 
    ...
    ...
     }


    zu stecken.


    Ja, richtig :)

    Wunderbare Idee, das könnte glatt funktionieren. Ich hoffe es funktioniert, denn das was ich so gegoogelt hab schaut alles furchtbar kompliziert aus.
  6. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!