Výpredaj matracov

Užívateľ

Zdravím, tak chcel by som znova poprosiť o pomoc.
Mám na stránke pozadie - modrú farbu cez celú stránku.
Na pozadí mám div, s position: absolute; a žltým pozadím.
Nad obrázkom s position: absolute mám div, s position: relative; a priehľadným pozadím.
Chcem, aby mi div s position: relative, ktorý je priehľadný, prekryl obrázok s position: absolute; ale zobrazil pozadie stránky.

Ukážka:

kód:

<!DOCTYPE html>

<html>
   <head>
      <style>
         html, body {
            background-color: blue;
         }

         * {
            margin: 0;
            padding: 0;
         }

         #absolute {
            position: absolute;
            top: 0;
            left: 0;
            width: 50px;
            height: 50px;
            background-color: yellow;
         }

         #relative {
            position: relative;
            margin-top: 25px;
            margin-left: 25px;
            width: 50px;
            height: 50px;
            border: 1px solid black;
         }
      </style>
   </head>
   <body>
      <div id="absolute"></div>
      <div id="relative"></div>
   </body>
</html>

Zobrazí:

Chcem aby zobrazilo:

V skutočnosti tam nemám background-color ale background-image, preto nemôžem jednoducho relatívnemu divu nastaviť farbu pozadia na blue.

// Napadá ma riešenie, že by som dal relatívnemu divu vlastnosť overflow:hidden;, vytvoril v ňom nový div a napozicioval ho tak, že by sa začínal od lavého horného rohu celej stránky, dal mu width a height na 100% a dal doňho zasa ten obrázok, čo mám na pozadí.
To by som ale musel poznať pozíciu toho relatívneho divu, aby som ten v ňom - ten nový mohol napoziciovať na lavý horný roh stránky. A tú nepoznám.

Užívateľ

tomu čo chceš mať vzadu daj z-index:1 a tomu čo vpredu z-index:2 , snáď by to malo fungovať

Výpredaj matracov

Auto od Profi Credit

Aktuálna novinka

Mať originál je jednoduché

Diéta - stojí to za to?

Ako prekryť priehľadným divom iný div

SEO - optimalizácia pre vyhľadávače

Freebsd