User97: Positionierung bis zu einer bestimmten Browserbreite ?

Hallo Zusammen,

ich versuche mich im Moment vergeblich daran, ein div-Objekt am rechten Browserrand so zu positionieren, dass es sich zwar ganz normal am Browserrand orientiert, dies aber nur bis zu einer bestimmten Browserbreite tut.

Ist eine minimal-width erreicht, soll das Objekt "stehen bleiben" und sich nicht weiter am Rand orientieren.

Bestimmt nur eine Kleinigkeit für euch?!

Zum besseren Verständnis, hier die "normale" Funktion, die ich mit einem "STOP" bei 1024px erweitern möchte >>

So sollte es später funktionieren: bitte Browser minimieren und zusammen schieben. Dabei auf die Navigation und das wetter.com-Frame achten.

Vielen Dank für eure Hilfe!

  1. Hallo Zusammen,

    Wenn du dem absolut positioniertem Hund nun ein margin-left verpasst bleibt er an der entsprechenden Stelle von links stehen.

    1. Hallo Zusammen,

      Wenn du dem absolut positioniertem Hund nun ein margin-left verpasst bleibt er an der entsprechenden Stelle von links stehen.

      Oder auch nicht. Erstmal Kaffe holen. Dann denken

  2. @@User97:

    nuqneH

    ich versuche mich im Moment vergeblich daran, ein div-Objekt am rechten Browserrand so zu positionieren

    div#this { float: right }

    dass es sich zwar ganz normal am Browserrand orientiert, dies aber nur bis zu einer bestimmten Browserbreite tut.
    Ist eine minimal-width erreicht, soll das Objekt "stehen bleiben" und sich nicht weiter am Rand orientieren.

    html { min-width:}

    Bedenke aber, dass horizontales Scrollen nicht nutzerfreundlich ist. Manche Nutzer werden auch übersehen, dass rechts außerhalb ihres Viewports noch Inhalt versteckt ist.

    Also lass dir was Besseres einfallen, als den Unsinn nachzubauen!

    Qapla'

    --
    Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
    (Mark Twain)
  3. Hallo Qapla',

    vielen Dank für deine Hilfe.
    Du hast natürlich recht, dass eventuelle Inhalte außerhalb des Viewport übersehen werden könnten.

    Da es aber lediglich um ein simples Logo geht, das letztendlich immer an der gleichen Stelle "wandern" soll, bis die Browserbreite letztendlich zu klein wird und es "Stoppen" soll.

    Leider funktioniert aber nur entweder das eine, oder das andere.
    Bleiben wir vielleicht mal beim simplen Bsp. des Hundes:
    Wie würdest du hier konkret vorgehen?:

    ---->

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
    <html><head><title>right</title>
    </head><body>

    <div style="position:absolute; top:100px; right:0px;">Rechtsb&uuml;ndiger Hund:<br>
    <img src="hund.gif" width="208" height="181" alt="Hund"></div>

    </body></html>

    <---

    Habe noch ein weiteres Beispiel meines "Problems" gefunden: siehe hier >>

    Nochmals vielen Dank im Voraus!

    1. @@User97:

      nuqneH

      Hallo Qapla',

      ??

      Wie würdest du hier konkret vorgehen?:

      Ganz konkret.

      <div style="position:absolute; top:100px; right:0px;">Rechtsb&uuml;ndiger Hund:<br>

      Ich würde allerdings weder Inline-Stileangaben in @style-Attributen verwenden (Alle Darstellungsangaben gehören ins Stylesheet!) noch Zeichen unnötigerweise escapen (Verwende 'ü' statt '&uuml;'!) noch 'br'-Elemente verwenden.

      Qapla'

      --
      Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
      (Mark Twain)
  4. ganz einfach

    width:100%;
    max-width:1024px;
    text-align:right;