HTML-dock nach unten

Ich habe Folgendes HTML:

<div class="gallery-item">
  <a href="ddd.pdf" style="display:block; width: 100%;">
    <span id="filename_1" style="white-space: nowrap;">Hello</span>
  </a>
  <div id="commands">
    <input type="text" readonly="readonly" value="https://blob">
    <a href="sdfasdfasdfasdf">Delete</a>
  </div>
</div>

CSS:

.gallery-item {
  border: 1px #AAA solid;
  display: inline-block;
  margin: 2px;
  padding 2px;
  width: 130px;
  height: 90px;
  text-align: center;
  border-radius: 5px;
  vertical-align: middle;
}    
  .gallery-item #commands {
    line-height: 4px;
    padding-bottom: 1px;
    vertical-align: bottom;
    bottom: 1px;
  }

Ich soll ausrichten commands div unten gallery-item eingestuft div. Keine der oben genannten gearbeitet, die commands hält sich an das vorhergehende element:

HTML-dock nach unten

NOPs für, zufällig ist der name der Datei getrimmt, wie Sie sehen können, in der unteren rechten Kachel, ist es ursprünglich "Analyse". Wie auch immer, ich hoffe, dass die Sekretärin ich arbeite mit ihm ein Gedanke.
BTW, here's die Trimm-Funktion. Sie sind willkommen, um zu kommentieren!

InformationsquelleAutor Shimmy | 2012-12-25

  1. 7

    Hinzufügen position: relative zu den Eltern.

    .gallery-item {
    position: relative;
}

.gallery-item #commands {
    position: absolute;
    bottom: 1px;
}

    Wenn Sie mit positioning, müssen Sie explizit angeben.

    InformationsquelleAutor Praveen Kumar Purushothaman

Schreibe einen Kommentar