Diskuze: Jak donutit <li> ke stejnému odsazování jako <p>?
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.


Asi bych se podíval, jaké deklarace používá <p> v základu a
prostě je tam opsal 
Konrétně je to:
p {
display: block;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
}
Samozřejmě se to může lišit u netradičních prohlížečů.
<p> v základu žádné deklarace nastavené nemá, není tedy co opsat
margin, padding, line-height, height, ...
On to jen neumi vysvetlit. Kazdy myslite neco jineho. P nema zadne styly v
css. Ale ma jakesi vlastni prednastavene (asi jako kazdy tag) vuci neutralnim
prvkum typu DIV nebo SPAN.
Cely problem kolem prednastavenych vlastnosti je slozitejsi. Kazdy prohlizec ma
nejake spesl vlastnosti, ktere v jinem nefunguji nebo delaji neco jineho.
Kazdopadne zrovna u LI by mel pomoci margin. Idealne uplne na zacatku nejdriv
vsechno vynulovat.
https://www.jakpsatweb.cz/css/margin.html
.navigace ul, .navigace li {display:block; margin:0; padding:0;}
Jeste jinak...
Pokud chces s necim poradit, je dobre sem dat zdrojovy kod, ktery staci pres
ctrl+c / ctrl+v zkopirovat do stranka.html a spustit.
Z tveho zadani neni jasne, co presne potrebujes a co mas hotove.
Mozna se pokousis docilit neco takoveho:
* aaa
* bbb<br>
. ccc - cili, aby v odrazce byl text a mezi bbb a ccc nebyla
. mezera jako mezi LI (ve vizualnich editorech je to obbvykle ctrl(nebo shift)+enter)
* ddd
Taky jsem moc nepochopil tvůj záměr a ty ses ještě nevyjádřil. Chápu to tak, že chceš udělat vertikální margin mezi položkami v seznamu. Jestli ano, tak stačí udělat odstavec <p> jednoduše jako položku. Odsazení poté můžeš následně ještě editovat pomocí stylu toho odstavce.
Ted mne napada, ze mozna odstavec pro navigaci by byla zajimava volba. Ale, vzhledem k tomu, ze obvykle pouziva clovek i mezery pred tagy a nema navigaci prilis velkou, tak je to asi jedno. Ale ty mezery by mohl umet odstranit server pred kesovanim. A pak to zipuje jeste.
<ul>
<li><a></a></li> ... 6 znaku pro nazvy tagu
<li><a></a></li> ... 6 znaku pro nazvy tagu
<li><a></a></li> ... 6 znaku pro nazvy tagu .. 18
</ul> + 4
<nav>
<p><a></a></p> ... 4 znaku pro nazvy tagu
<p><a></a></p> ... 4 znaku pro nazvy tagu
<p><a></a></p> ... 4 znaku pro nazvy tagu ... 12
</nav> + 6
Má. Když se podíváš ve vývojářských nástrojích do CSS deklarací, tak tam jsou uvedeny v kolonce "user agent stylesheet". Tedy jsou tam uvedeny trochu jinak, ale jsou to v podstatě ty základní vlastnosti, se kterými většina prohlížečů prvek <p> zobrazuje.
Viz zde, pod nadpisem Default CSS Settings:
https://www.w3schools.com/tags/tag_p.asp
Aha. Mam to, i ve Firefoxu neco je. Pekne, ale je jich tam asi 100, v tom
neco najit 
Už jsem na to mezi tím přišel, pomohlo nastavit li {margin-bottom:
0.5em;}
Co jsem chtěl docílit je vidět na www.proelektroprojektanty.cz/GTZ2.html, třeba hned v
opovědích na tu první otázku. Bez toho margin-bottom jsou jednotlivé
odrážky slité dohromady, s margin-bottom jsou mezi nimi opticky mezery.
Zobrazeno 10 zpráv z 10.