---
site_name: WPlama
site_description: "Správa, opravy a vývoj WordPress webů a e-shopů"
site_url: https://www.wplama.cz
contact_email: info@wplama.cz

title: DIVI-Pozicování obrázku jako pozadí sekce
url: https://www.wplama.cz/dotaz/divi-pozicovani-obrazku-jako-pozadi-sekce/
date: 2017-01-05
modified: 2017-01-14
type: dwqa-question
---

[Šablony](https://www.wplama.cz/poradna/?tema=sablony-3)

# DIVI-Pozicování obrázku jako pozadí sekce

AD **Adam** 5. 1. 2017 [4 odpovědi](https://www.wplama.cz/dotaz/divi-pozicovani-obrazku-jako-pozadi-sekce/#odpovedi)

Ahoj,
mám vytvořený header stránky, kde mám požitý obrázek jako pozadí sekce. Potřebuji poradit jakým způsobem docílit toho, aby mi horní okraj obrázku lícoval s horním okrajem sekce?
Je nějaký způsob v rámci DIVI builderu nebo musím přes CSS, případně jakým způsobem pozicovat?

Děkuji

## Odpovědi 4

WP **Tomáš Cirkl, WPlama** 5. 1. 2017 Odpověď WPlama

Ahoj,
mělo by to jít s css a dát si pro tu sekci
background-position: center top;

DŠ **Dominik Štoller z webu wp-radce.jecool.net** 14. 1. 2017

Dobrý den, zřejmě chcete, aby byl obrázek responzivní a ladil do všech okrajů v header.php? Udělejte následující:

Do header.php vložte: `![sem%20vlo%C5%BEte%20odkaz%20obr%C3%A1zku](https://www.wplama.cz/dotaz/divi-pozicovani-obrazku-jako-pozadi-sekce/sem%20vlo%C5%BEte%20odkaz%20obr%C3%A1zku "sem%20vlo%C5%BEte%20odkaz%20obr%C3%A1zku")`
Do CSS vložte: `.muj_obrazek{ width: 100%; background-size: 100% 100%; } and finally, we serve for every view-port the right image: /* Retina display */ @media screen and (min-width: 1024px){ .responsive-image{ background-image: url('../img/retina.jpg'); } } /* Desktop */ @media screen and (min-width: 980px) and (max-width: 1024px){ .responsive-image{ background-image: url('../img/desktop.jpg'); } } /* Tablet */ @media screen and (min-width: 760px) and (max-width: 980px){ .responsive-image{ background-image: url('../img/tablet.jpg'); } } /* Mobile HD */ @media screen and (min-width: 350px) and (max-width: 760px){ .responsive-image{ background-image: url('../img/mobile-hd.jpg'); } } /* Mobile LD */ @media screen and (max-width: 350px){ .responsive-image{ background-image: url('../img/mobile-ld.jpg'); } }`

DŠ **Dominik Štoller z webu wp-radce.jecool.net** 14. 1. 2017

Dobrý den, ještě jsem Vám chtěl napsat <img kód, který je nutný vložit do header.php, ale bohužel se tu debilně zobrazuje, i když dávám v html zkratky <code></code>...

Vložte do header.php kód:

<img src="odkaz_obrázku" class="muj_obrazek">

WP **Tomáš Cirkl, WPlama** 9. 1. 2024 Odpověď WPlama

Ahoj,
mělo by to jít s css a dát si pro tu sekci
background-position: center top;

Přidat odpověď

Přidat odpověď [Zrušit odpověď na komentář](https://www.wplama.cz/dotaz/divi-pozicovani-obrazku-jako-pozadi-sekce/#respond)