Halte div am unteren Rand eines anderen Bereichs

© 1965 - 2010

Ich will das #Urheberrecht an der Unterseite der #äußeren

Hier ist der css-Code für #copyright

#copyright{
    position:relative; margin-bottom:0px; width:672px; height:20px; color:#FFF;
}
#yr{
    margin:auto;
}

#f{ position:absolute; right:0px; text-align:center;
}

Dank
Jean

InformationsquelleAutor der Frage X10nD | 2010-07-08

  1. 57
    #copyright {
    position: absolute;
    bottom: 0;
}
#outer {
    position: relative;
}

    Wird dies den unglücklichen Nebeneffekt, obwohl, dass #copyright zählen nicht in Richtung der Höhe der #outer mehr, ist in deinem Beispiel #outer wäre 0px hoch. Sie können hinzufügen, ein bottom-padding #outer wenn Sie arbeiten mit festen Höhen.

    #copyright {
    position: absolute;
    bottom: 0;
    height: 200px;
}
#outer {
    position: relative;
    padding-bottom: 200px;
}

    InformationsquelleAutor der Antwort deceze

  2. 5
    1. definieren, die Höhe von #äußeren
    2. set #outer position:relative;

    3. set #copyright auf position:absolute; bottom: 0; left: 0;

      #äußeren {
      height: 100px;
      border: 1px solid red;
      position: relative;
      }

      #copyright {
      position:absolute;
      height: 30px;
      bottom: 0;
      left: 0;
      border: 1px solid black;
      width: 300px;
      }

      <div id="outer">
   <div id="copyright">
       <span id="yr">© 1965 - 2010</span>
       <span id="f"></span>
       <span id="d"><span>
   </div>
</div>

    Auch, niemals "0px". Es gibt keine solche Sache wie null Pixel, nur null. Richtige Weg ist "right: 0;"

    InformationsquelleAutor der Antwort Māris Kiseļovs

  3. 3

    Ich würde das tun auf diese Weise:

    #copyright {
position: absolute;
bottom: 0;
}
#outer {
position: relative;
height: 200px;
}

<div id=outer>


<div id="copyright">
    <span id="yr">&copy; 1965 - 2010</span>
    <span id="f"></span>
    <span id="d"></span>
</div>



</div>

    InformationsquelleAutor der Antwort koshin

  4. 1

    Ändern Sie die Positionierung auf #copyright absoluten und fügen eine relative Positionierung Kontext zu #outer. Dann fügen Sie bottom: 0px zu #copyright als gut.

    Sorry. CSS würde so Aussehen:

    #copyright{
   position:absolute; margin-bottom:0px; width:672px; height:20px; color:#FFF; bottom: 0px;
}
#yr{
   margin:auto;
}
#f{
   position:absolute; right:0px; text-align:center;
}
#outer {
   position: relative;
}

    InformationsquelleAutor der Antwort desertwebdesigns

Schreibe einen Kommentar