Bewegen Sie ein Bild nach unten

Ich entwickle eine Webseite für Bilder auf einem Karussell. Wie kann ich ein Bild unten in einem DIV-oder auch center vertikal?

Hier ist mein CSS code:

.carousel .item {
  height: 900px;
  background-color: #777;
}
.carousel-inner > .item > img {
    display: block;
    margin-left: auto;
    margin-right: auto
}

Hier ist eine URL, um die Webseite in Frage, Ihnen zu zeigen, dass das Bild zu hoch: http://www.canninginc.co.nz/canluciddream/screenshots.html

BEARBEITEN

Ok, das habe ich bearbeitet den code durch ändern der:

margin-top: 50px;

Ich bin immer noch nach dem Bild unten in der div. Ich kann vergrößern Sie den oberen Rand, aber das hinterlässt einen weißen hintergrund. Was wäre der beste Weg, um sich das Bild ein wenig kleiner?

InformationsquelleAutor Dietfried Bello | 2013-09-13
  1. 0

    Als erstes die .position relative, und dann
    auf css:

    .carousel-inner > .item > img {
    position:absolute;
    top:25%;
    left:25%;
}

    Dies zentriert das Bild vertikal

    InformationsquelleAutor bring2dip
  2. 0

    Setzen Bild innerhalb des Haupt-Körpers, stellen Sie den Haupt-Körper-position: relative, dann das Bild auf position: absolute; top: 0; left: 0;

    Wenn Sie nicht setzen Sie das Bild innerhalb des Haupt-Körpers, dann fügen Sie einen negativen margin-top an den Haupt-Körper.

    InformationsquelleAutor Walter Jamison
  3. 0

    Geben, Rand oben 130px auf das Bild und es sieht cool aus!

    margin-top: 130px;
    InformationsquelleAutor AshwinKumarS
  4. 0

    Dein problem ist nicht, dass das Bild zu hoch angebracht - es ist festen header. So setzen margin-top:50px statt -80px für .myCarousel.

    InformationsquelleAutor Cthulhu
  5. 0

    Den Grund, das Bild wird hinter der Navigationsleiste am oberen Rand ist, weil Sie in der Navigationsleiste die position legen Sie fest. Dies entfernt Sie aus dem rest der Seite für styling Zwecke, dass die anderen divs/Elemente nicht erkennen, wenn Sie zu positionieren. Wenn Sie entfernen die position: fixed; css auf das Element, die anderen Elemente wird die position relativ zu diesem ein. Eine andere option wäre, fügen Sie genug von einem oberen Rand auf das Bild-element, um es nach unten drücken, die unterhalb der top-bar standardmäßig, je nachdem, was Sie bevorzugen.

    InformationsquelleAutor Bardicer
Schreibe einen Kommentar