Diskuze: Stejný prohlížeč, rozhozene zobrazení
V předchozím kvízu, Online test znalostí HTML a CSS, jsme si ověřili nabyté zkušenosti z kurzu.


Zobrazeno 10 zpráv z 10.
K personalizaci obsahu a reklam, poskytování funkcí sociálních médií a analýze naší návštěvnosti využíváme soubory cookie. Informace o tom, jak náš web používáte, sdílíme se svými partnery pro sociální média, inzerci a analýzy. Partneři tyto údaje mohou zkombinovat s dalšími informacemi, které jste jim poskytli nebo které získali v důsledku toho, že používáte jejich služby.
Používáme nezbytné cookies pro fungování webu a s tvým souhlasem také analytické a marketingové cookies.
Zajišťují základní funkce, bezpečnost a služby, které sis vyžádal. Nelze je vypnout.
| Služba | Poskytovatel | Účel | Cookies a úložiště | Doba uložení |
|---|---|---|---|---|
| ITnetwork | ITnetwork | Provoz webu, relace, přihlášení a uložení nastavení cookies. | PHPSESSID, auth_token, sid, itn_consent_impression, __Host-itn_consent | Relace až 1 rok |
| Google Tag Manager | Správa značek a načítání měřicích nástrojů webu. | Žádné | Neukládá se | |
| Google Fonts | Načítání typografie webu. | Úložiště řízené poskytovatelem | Dle podmínek poskytovatele | |
| Google Hosted Libraries | Načítání potřebných knihoven a stylů webu. | Úložiště řízené poskytovatelem | Dle podmínek poskytovatele | |
| Google reCAPTCHA | Ochrana formulářů a webu před zneužitím. | _GRECAPTCHA, rc::a, rc::b, rc::c, rc::f | Relace až 180 dní | |
| YouTube | Přehrávání vloženého video obsahu. | localStorage, IndexedDB; cookies after playback interaction | Relace až trvalé úložiště | |
| Vimeo | Vimeo | Přehrávání vloženého video obsahu. | __cf_bm, _cfuvid, vuid, localStorage, IndexedDB | Relace až 2 roky |
| Facebook Login | Meta | Přihlášení pomocí účtu třetí strany. | Úložiště řízené poskytovatelem | Relace až 1 rok |
| GoPay | GoPay | Zpracování uživatelem vyžádané platby. | Úložiště řízené poskytovatelem | Dle podmínek poskytovatele |
Pomáhají nám porozumět používání webu a zlepšovat ho.
| Služba | Poskytovatel | Účel | Cookies a úložiště | Doba uložení |
|---|---|---|---|---|
| Google Analytics 4 | Měření návštěvnosti a používání webu. | _ga, _ga_* | Až 2 roky | |
| Microsoft Clarity | Microsoft | Měření návštěvnosti a používání webu. | _clck, _clsk, _cltk | Relace až 1 rok |
Slouží k měření kampaní, personalizaci reklamy a marketingové komunikaci.
| Služba | Poskytovatel | Účel | Cookies a úložiště | Doba uložení |
|---|---|---|---|---|
| Google Ads | Měření kampaní, reklama a remarketing. | _gcl_au, _gcl_ls | Relace až 90 dní | |
| Meta Pixel | Meta | Měření kampaní, reklama a remarketing. | _fbp, _fbc, localStorage | Až 90 dní |
| Sklik | Seznam.cz | Měření kampaní, reklama a remarketing. | retargeting, sid, szn:* | Relace až trvalé úložiště |
| LinkedIn Insight | Měření kampaní, reklama a remarketing. | bcookie, li_gc, lidc, __cf_bm | Relace až 1 rok | |
| Ecomail | Ecomail.cz | Měření kampaní, reklama a remarketing. | ecmid, Úložiště řízené poskytovatelem | Dle podmínek poskytovatele |
| Atribuce kampaní ITnetwork | ITnetwork | Přiřazení návštěvy a objednávky ke kampani. | campaign_clid[*], user_session_context | Až 1 rok |
V předchozím kvízu, Online test znalostí HTML a CSS, jsme si ověřili nabyté zkušenosti z kurzu.


Ahoj Verčo, možná by nebylo do věci nasdílet odkaz na tvé webovky... takto se dá jen těžko posoudit, kde by mohl být zádrhel.
Jasně, hned zítra až budu u pc, tak vložím. Jelikož se mi to dneska tak rozházelo, tak jsem to raději odstranila, tak jsou teď webovky neaktivní. Díky moc za zájem.
Ahoj, tak vkládám zdrojový kód, znovu jsem se na to ráno koukala a netuším, kde jsem udělala chybu. Asi to bude něco triviálního, ale jelikož se učím metodou pokus omyl, tak budu vděčná za jakoukoliv připomínku. Obrázky jsou jak mi to vyhazuje po vložení loga na mém prohlížeči v opeře, když jsem si upravovala zdroj v notepadu a průběžně kontrolovala. A další pak jak se mi to zobrazilo po nahrání na web, otevřeno ve stejném prohlížeči v opeře.
zdroj - logo:
<body>
<img class="logo img-fluid rounded-circle clearfix" src="img/logo.png"
alt="logo">
<h1 class="site-heading text-center text-white d-none d-lg-block">
<span class="site-heading-upper text-primary mb-3">Kavárna, obchod a
e-shop</span>
<span class="site-heading-lower">Cafe Kalahari</span>
</h1>
<h1 class="text-center text-white d-lg-none d-block">
<span class="site-heading-small mb-3 d-lg-none">Kavárna, obchod a
e-shop</span>
</h1>
<!-- Navigation -->
<nav class="navbar navbar-expand-lg navbar-dark py-lg-4" id="mainNav">
<div class="container">
<img class="logomale img-fluid rounded-circle clearfix d-lg-none"
src="img/logomale.png" alt="logo">
<a class="navbar-brand text-uppercase text-expanded font-weight-bold
d-lg-none" href="#">Cafe Kalahari</a>
css:
@media (min-width: 992px) {
.logo {
position: absolute;
margin-left: 80px;
margin-top: -10px;
}
}
@media (min-width: 992px) {
.logomale {
display: none;
}
}
@media (max-width: 992px) {
.logomale {
padding-top: 5px;
}
}
@media (max-width: 992px) {
.logo {
display: none;
}
}
zdroj galerie:
<section class="page-section">
<div class="container">
<div class="row">
<div class="col-xl-9 col-lg-10 mx-auto">
<div class="bg-faded rounded p-5">
<h2 class="section-heading mb-4">
<span class="section-heading-upper">Fotogalerie</span>
</h2>
<div id="album">
<a href="img/foto1.jpg" title="Kavárna"><img
src="img/foto1_nahled.jpg" alt="Kavárna" /></a>
<a href="img/foto2.jpg" title="Kavárna"><img
src="img/foto2_nahled.jpg" alt="Kavárna" /></a>
<a href="img/foto3.jpg" title="Kavárna"><img
src="img/foto3_nahled.jpg" alt="Kavárna" /></a>
<a href="img/foto6.jpg" title="Soška"><img
src="img/foto6_nahled.jpg" alt="Soška" /></a>
<a href="img/foto4.jpg" title="Káva"><img
src="img/foto4_nahled.jpg" alt="Káva" /></a>
<a href="img/foto5.jpg" title="Zákusek"><img
src="img/foto5_nahled.jpg" alt="Zákusek" /></a>
<a href="img/foto7.jpg" title="Zákusek"><img
src="img/foto7_nahled.jpg" alt="Zákusek" /></a>
<a href="img/foto8.jpg" title="Zákusek"><img
src="img/foto8_nahled.jpg" alt="Zákusek" /></a>
</div>
</div>
</div>
</div>
</div>
</section>
css:
#album img {
border: 1px solid gray;
padding: 6px;
box-shadow: 3px 3px 6px #999999;
margin-right: 6px;
margin-bottom: 6px;
}
Ještě jednou děkuju za jakoukoliv radu:-)
Verčo, opravdu je potřeba poslat spíše odkaz na web a případně popsat problém, pokud není viditelný na první pohled, vytáhnout část kódu ze souborů bohužel jednoduchému řešení nepomůže... je to vytržené z kontextu
Jo, omlouvám se, zapomněla jsem na ten web. Nicmeně jsem z webu stejně to logo odstranila, když bylo nefunkční. www.cafekalahari.cz
Jde o to, že logo se má zobrazit na větším rozlišení nahoře nad menu, ve stejnm zarovnání jako nadpis, řešila jsem to přes pozicování absolutní, ale jakmile jsem to nahrála na web, tak se to umístilo do horního rohu, a ještě k tomu se to velké logo zobrazuje i na malých zařízeních, viz vlozeny obrázek, kde jsou loga dvě, jedno velké nahoře a jedno malé na liště menu. Nevím, možná mám v css @media nastavena špatně.
A ještě k te galerii, vložila jsem tam galerii, která byla popsaná zde na itnetworku, kdyz jsem to tvořila u sebe v pc, tak po otevření v opeře se to ukázalo tak, jak mělo. Ovšem když si teď otevřu přímo web, tak se mi veškeré úpravy nezobrazily, a galerie vypadá tak jak vypadá. Děkuju moc.
Rozumím. Ručně jsem si doplnil tag s img a velkým logem a v chrome to funguje patrně podle očekávání je vedle nadpisu a pro width < 992px zmizí ... je možné logo vložit zpět do kódu? Zkusil bych i tu Operu.
takže Verčo, replikoval jsem tvé webovky, můžeš mrknout zde https://tomas-novotny.eu/itnet/66326/
a patrně funguje vše jak má.... to jak v chrome tak opeře... a to jak s
malým velkým logem tak patrně s galerií..
zádrhel nebude patrně ve webovkách ale v prohlížeči...
Zobrazeno 10 zpráv z 10.