21. září bude sraz! Od 18.00 v restauraci Tradice v Praze u Anděla
Autor Zpráva
Jan Žák
Profil
Dobrý den všem,

Mám web založený na Wordpressu a potřeboval bych poradit jak pomocí CSS umístit galerii nad fotografií. Tato fotografie je zobrazeno pomocí tagu figure jako background-image.
Pod ní je footer, který potřebuji mít úplně dole na stránce. Pokud nemám galerii zobrazenou, je vše v pořádku, po zobrazení se mi footer přemístí. A to je právě můj problém.

Děkuji moc za Vaši pomoc.

CSS fota na pozadí:
._photo{
  /* Set rules to fill background */
  min-height: 100%;
  min-width: 1024px;
  /* Set up proportionate scaling */
  width: 100%;
  height: auto;
  /* Set up positioning */
  position: fixed;
  /* Location of the image */
  background-image:url('images/default.jpg');
  /* Background image is centered vertically and horizontally at all times */
  background-position: center center;
  /* Background image doesn't tile */
  background-repeat: no-repeat;
  /* Background image is fixed in the viewport so that it doesn't move when 
     the content's height is greater than the image's height */
  background-attachment: fixed;
  /* This is what makes the background image rescale based
     on the container's size */
  background-size: cover;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
}

CSS pro footer
#footer{
    z-index: 1;
    position: absolute;
    bottom: 0px;
    right: 0;
    left: 0;
    height: 3em;
  display: flex;
  /* flex-direction: column;*/
  align-items: center; 
  /* justify-content: center;*/
    background: url('images/rgba-30.png');
    background: rgba(0,0,0,0.5);
    text-shadow: rgba(0,0,0,0.8) 0 1px 1px;
    color: #eee;
}

CSS pro galerii
.entry-gallery {
  position: relative;
  display: inline-block;
  margin-top: 80px;
    margin-left: 1%;
    padding:1em 1em;
    color:#ffffff;
    background-color:rgba(0,0,0,0.3);
    background-color:transparent\9;filter:progid:DXImageTransform.Microsoft.gradient(gradientType=0,startColorstr='#4D000000',endColorstr='#4D000000');
    -webkit-border-radius:1px;
    -moz-border-radius:1px;
    -o-border-radius:1px;
    border-radius:1px;
}

Aktuální foto

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0