Chris: Problem mit Seitenränder

SELF-Forum

Problem mit Seitenränder

Chris
– Informationen zu den Bewertungsregeln

Hallo, ich hab ein kleines Problem mit meinen Seitenrändern, ich hab schon so ziemlich alles versucht, aber es funktioniert nicht so wie ich will.

Zum Prob:

HTML-Fotoalbum, Klick auf ein Thumbnail, das Bild (eingebettet in eine HTML Datei) öffnet sich mittels Javascript in einem neuen Fenster. Unter jedem Bild steht noch ein Komentar. Soweit so gut. Darunter steht allerdings noch die Option "zurück ll vorwärts" zur Verfügung um eben vo oder zurück zu blättern. Da jetzt die Kommentare der Bilder unterschiedlich lang sind, verschiebt sich "zurück ll vorwärts" immer. Ich hättes es aber gerne, dass "zurück ll vorwärts" einen bestimmten Abstand zum unteren Fensterrand hat. Was ich versuch, es klappt nicht. Ich kann zwar den Abstand nach unten verändern, aber dann kann ich eben das Bild verschieben. "zurück ll vorwärts" soll aber einen festen Abstand haben, egal wie lang die Kommentare sind.

Hier der Quelltext:

<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">

<!--

body {background-color: #3399FF;}

.stil1 {font-family: Georgia, "Times New Roman", Times, serif; color: #FFFFFF; font-size:12px; margin-left:30px;}
  .Stil2 {font-family: Georgia, "Times New Roman", Times, serif; color: #FFFFFF; font-size:10px;}

a:link {color: #FFFFFF; text-decoration:none}
  a:visited {color: #FFFFFF; text-decoration:none}

-->

</style>

</head>

<body>

<div style="text-align:center">
  <img src=".././02.jpg" style="border-style:none" title="Erste Bekanntschaften"></a></div>

<p class="stil1">
  Die Ersten machen sich schon untereinander bekannt.</p><br>
  <br>

<p class="Stil2" align="center">
   <a href="01.htm">zurück</a> &nbsp||&nbsp <a href="03.htm">vorwärts</a></p>

</body>
</html>

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Problem mit Seitenränder

    beza1e1 Homepage des Autors
    – Informationen zu den Bewertungsregeln

    <p class="Stil2" align="center">
       <a href="01.htm">zurück</a> &nbsp||&nbsp <a href="03.htm">vorwärts</a></p>

    Du willst diesen p Tag an den unteren Bildschirmrand klatschen?

    1. mach class="Stil2" zu id="Stil2" (Nicht notwendig, aber richtiger)
    2. Stylesheet: #Stil2 { position: ansolute; bottom: 0px; left: 0px; }

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Problem mit Seitenränder

      Chris
      – Informationen zu den Bewertungsregeln

      also wenn ich aus class id mach, dann sind die ganzen formatierungen verloren, muss ich da bei .stil1 etc auch noch was ändern, wenn ja was?

      Und wo genau muss ich des position einfügen, bei .stil2{...} oder wo, da klappts nämlich net. Danke.

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. Problem mit Seitenränder

        beza1e1 Homepage des Autors
        – Informationen zu den Bewertungsregeln

        Äh. ich seh da grad einen Fehler. Hast du ansolute geschrieben? Muss absolute heißen. Es könnte sein, dass absolute bei class nicht funktioniert, da man Elemente einer Gruppe von Elementen eigentlich nicht absolute positionieren kann.

        Mal ganz von vorne. HTML sollte semantisch sein. Also class und ids nach Bedeutung nicht nach Aussehen vergeben.

        <div class="Bild">
          <img src="..." />
          <p id="Beschreibung">blabla</p>
          <div id="left"><a href="...">zurück</a></div>
          <div id="right"><a href="...">vorwärts</a></div>
        </div>

        So und jetzt muss aber
          #left  {position: absolute; left:  0px; bottom: 0px;}
          #right {position: absolute; right: 0px; bottom: 0px;}
        funktionieren

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln