Hans: Element abhängig von einem anderen Element absolut positionieren

Hallo,
ich habe bei einer Website einen Content, der 1000px breit ist. Wenn jetzt jemand mit einem größeren Monitor die Website anschaut, dann soll sich der gesamte Content in die Mitte verschieben, dass nicht alles so an den linken rand gequetscht ist. Das Problem ist, dass ich im Content selbst einige Elemente absolut positioniert habe, und die dann auch absolut positioniert bleiben, während der restliche Content in die Mitte rutscht, wenn man das Fenster größer macht.
Kann man ein Element irgendwie absolut und gleichzeitig in Abhängigkeit von einem anderen Element (-> nicht der Gesamtseite) positionieren?

Danke
Hans

  1. Hallo,

    Kann man ein Element irgendwie absolut und gleichzeitig in Abhängigkeit von einem anderen Element (-> nicht der Gesamtseite) positionieren?

    Ja: Gib dem Container einen, von static abweichenden Wert (z.B. relative).

    mfg. Daniel

    1. Also im IE funktioniert es jetzt, aber im Firefox leider nicht!?!
      Ich poste einfach mal die Inhalte:

      HTML:

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
      <html>
      <head>
      <title>The Orange Fizz</title>
      <link rel="stylesheet" href="KoD.css" type="text/css">
      </head>
      <body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0" marginwidth="0" marginheight="0">

      <table align="center" style="position:relative"; background-repeat:no-repeat;" border="0" width="1000px" height="100%" background="hintergrund.gif">
        <tr>
         <td>
         <div id="band">
        <a class=band href="html-content/band.html" target="content"></a>
       </div></td>
        </tr>
       </table>

      </body>
      </html>

      CSS:

      a.band {
              display: block;
       position:absolute;
       top:87px;
       left:160px;
              width:107px;
       height:65px;
      }
      a.band:hover {
              background-color: #000000;
       background-image: url(aktiv/aktiv_band.gif);

      1. Hallo,

        Also im IE funktioniert es jetzt, aber im Firefox leider nicht!?!
        Ich poste einfach mal die Inhalte:

        <table align="center" style="position:relative"; background-repeat:no-repeat;" border="0" width="1000px" height="100%" background="hintergrund.gif">

        Hast du dir den Code schon mal in einem Editor mit Syntax-Highlighting angesehen? Dann wäre dir ein Fehler aufgefallen.

        PS: Die Tabelle wird aber noch durch ein passenderes Element ersetzt oder?!

        mfg. Daniel

        1. <table align="center" style="position:relative"; background-repeat:no-repeat;" border="0" width="1000px" height="100%" background="hintergrund.gif">

          Hast du dir den Code schon mal in einem Editor mit Syntax-Highlighting angesehen? Dann wäre dir ein Fehler aufgefallen.

          Hab jetzt des überflüssige " raus, aber es geht trotzdem nicht :-(

          1. Hallo,

            <table align="center" style="position:relative"; background-repeat:no-repeat;" border="0" width="1000px" height="100%" background="hintergrund.gif">

            Hast du dir den Code schon mal in einem Editor mit Syntax-Highlighting angesehen? Dann wäre dir ein Fehler aufgefallen.

            Hab jetzt des überflüssige " raus, aber es geht trotzdem nicht :-(

            Hab's gerade selbst probiert. Scheinbar geht das nicht bei Tabellen. Beseitige also den Übeltäter (was ich empfehle) oder schachtele ihn eben in einen weiteren Container, den du relativ positionierst.

            mfg. Daniel

            1. Habs jetzt so gemacht, ist zwar umständlich, aber funzt:

              <div align="center">
               <div style="position:relative; background-repeat:no-repeat; width:1000px; height:100%; background-image:url('hintergrund.gif');">

              <div id="band">
                <a class=band href="html-content/band.html" target="content"></a>
               </div>
               </div>
               </div>

              1. Hallo,

                Habs jetzt so gemacht, ist zwar umständlich, aber funzt

                Wenn du dich noch ein bisschen mehr mit CSS beschäftigst, und deine Seite im standardkonformen Modus auslieferst, bräuchtest du nur 1 <div>. Zentrieren könntest du es dann mit margin:0em auto;

                Aber was soll's, der Wegfall der Tabelle ist schon mal ein guter Anfang :-)

                mfg. Daniel

  2. hallo,

    ich habe bei einer Website einen Content, der 1000px breit ist. Wenn jetzt jemand mit einem größeren Monitor die Website anschaut

    Und wenn jemand einen kleineren Viewport benutzt? Bei mir ist ein Browserfenster selten 1000 Pixel breit. Was hältst du von Breitenangaben in % oder em?

    Kann man ein Element irgendwie absolut und gleichzeitig in Abhängigkeit von einem anderen Element (-> nicht der Gesamtseite) positionieren?

    Eigentlich nicht - aber so ganz klar wird nicht, was du meinst. Außerdem: Positionieren machst du mit CSS. Wie seht denn deine CSS aus?

    Grüße aus Berlin

    Christoph S.

    --
    Visitenkarte
    ss:| zu:) ls:& fo:) va:) sh:| rl:|
    1. Hier mal ein Screenshot:
      http://img356.imageshack.us/img356/7738/screenieik2.jpg

      1. hallo,

        Hier mal ein Screenshot

        Der enthält leider keinerlei überprüfbaren HTML-Code.

        Grüße aus Berlin

        Christoph S.

        --
        Visitenkarte
        ss:| zu:) ls:& fo:) va:) sh:| rl:|