Kategorie

CSS definice pro umístění vlajek

Následující tabulky obsahují CSS definice umístění vlaječek pomocí boxů, na který odkazujeme ze článku Propojení vícejazyčných webů za pomocí vlaječek.

U šablony HANAMI doporučujeme, využít první možnosti vložení vlajek, jako položek menu.

HTML zápis
<div id="jazykova-mutace">
  <div class="inside">
    <a href="/">
      <img src="/obrazek/3/de-png/" alt="de" /
     </a>
    <a href="/">
      <img src="/obrazek/3/cz-png/" alt="cz" />
    </a>
  </div>
</div>
CSS zápis

/* ---[ jazykova-mutace ]--- */
#jazykova-mutace { max-width: 1170px; margin: 0 auto; text-align: right; }
#jazykova-mutace .inside { width:100%; margin: 0; }

Umistění vlaječek: vlastní box 3

HTML zápis
<div id="jazykova-mutace">
  <div class="inside">
     <a href="/">
      <img src="/obrazek/2/de-png/" width="16" height="11" />
    </a>
   <a href="/">
      <img src="/obrazek/2/cz-png/" width="16" height="11" />
    </a>
  </div>
</div>
CSS zápis

/* ---[ jazykova-mutace ]--- */
.inside { width:960px; text-align:right; margin:0 auto; z-index:1; position: relative;}
#jazykova-mutace { width:100%; position:absolute; top: 10px; left:0; z-index:0;}
#jazykova-mutace img {margin:5px;}

Umístění vlaječek: vlastní box č. 1 nebo vlastní box č. 2 nebo vlastní patička

CSS zápis

/* ---[ jazykova-mutace ]--- */
#jazykova-mutace {
  position: absolute;
  top: 50px; right: 30px;
  z-index:10;
}

#jazykova-mutace img {margin:5px;}

Umístění vlaječek: vlastní box č. 1

CSS zápis

/* ---[ jazykova-mutace ]--- */
#jazykova-mutace {
  position: absolute;
  top: 255px; right: 50px;
  z-index:10;
}

#jazykova-mutace img {margin:5px;}

Umístění vlaječek: vlastní box č. 1

CSS zápis

/* ---[ jazykova-mutace ]--- */
#jazykova-mutace {
  position: absolute;
  top: 190px; right: 15px;
  z-index:10;
}

#jazykova-mutace img {margin:5px;}

/* ---[ template ]--- */
#container {padding-top: 196px;}

Umístění vlaječek: vlastní box č. 1

CSS zápis

/* ---[ jazykova-mutace ]--- */
#jazykova-mutace {
  position: absolute;
  top: 5px; right: 20px;
  z-index:10;
}

#jazykova-mutace img {margin:5px;}

Umístění vlaječek: vlastní box č. 1

CSS zápis

/* ---[ jazykova-mutace ]--- */
#jazykova-mutace {
  position: absolute;
  top: 5px; right: 20px;
  z-index:10;
}

#jazykova-mutace img {margin:5px;}

/* ---[ template ]--- */
#c0 { padding-top: 234px; }

/* ---[ theme ]--- */
#theme { top: 30px; }

Umístění vlaječek: vlastní box č. 2

CSS zápis

/* ---[ jazykova-mutace ]--- */
#jazykova-mutace {
  position: absolute;
  top:-25px; right: 5px;
  z-index:10;
}

#jazykova-mutace img {margin:5px;}

/* ---[ template ]--- */
body {  padding: 30px 0; }

Umístění vlaječek: vlastní box č. 1

CSS zápis

/* ---[ jazykova-mutace ]--- */
#jazykova-mutace {
  position: absolute;
  top: 285px; right: 15px;
  z-index:10;
}

#jazykova-mutace img {margin:5px;}

Umístění vlaječek: vlastní box č. 1

CSS zápis

/* ---[ jazykova-mutace ]--- */
#jazykova-mutace {
  position: absolute;
  top: 5px; right: 20px;
  z-index:10;
}

#jazykova-mutace img {margin:5px;}

/* ---[ template ]--- */
#c0 { padding-top: 219px; }

/* ---[ theme ]--- */
#theme { top: 30px; }

Umístění vlaječek: vlastní box č. 2

CSS zápis

/* ---[ jazykova-mutace ]--- */
#jazykova-mutace {
  position: absolute;
  top: 40px; right: 25px;
  z-index:10;
}

#jazykova-mutace img {margin:5px;}

Umístění vlaječek: vlastní patička

CSS zápis

/* ---[ jazykova-mutace ]--- */
#jazykova-mutace {
  position: absolute;
  top:-25px; right: 5px;
  z-index:10;
}

#jazykova-mutace img {margin:5px;}

/* ---[ template ]--- */
#container {
  background: none;
  margin-top: 30px;
}

Umístění vlaječek: vlastní patička