Autor Zpráva
Suta
Profil
Dokázal by mi někdo poradit, jak odstranit mezery mezi jednotlivými položkami li seznamu ul, tedy aby byly jednotlivé položky na sebe těsně nalepeny?

Jedná se o tento kód:

<style>
ul {
  margin: 0; padding: 0;
}
li {
  display: inline;
  margin: 0; padding: 0;
  list-style-type: none;
  border: 1px solid red;
}
</style>

<ul>
  <li>Lorem ipsum</li>
    <li>Dolor sit amet</li>
      <li>Consectetuer</li>
        <li>Quisque dui</li>
</ul>


Po odstranění striktního doctype mezery zmizí, nicméně nejsem zastáncem stránek bez jeho uvedení...

Díky za pomoc.

Ukázka problému: http://petrzavicak.cz/ukazky_problemu/ukazka_1.html
Plaváček
Profil
Suta

Zkus je nechat plavat (float:left)
Suta
Profil
Plaváček
Děkuji, pomohlo.
Suta
Profil
Prosím o radu ještě s jedním problémem týkajícím se seznamu ul.

Mám-li v jedné položce li, která má nastavenu relativní pozici další vnořený seznam, který má pozici absolutní (je tedy posouván vzhledem k levému hornímu okraji rodiče, pak se jeho šířka (vnořeného seznamu) odvozuje od šířky rodiče. Tady však zaprvé nevím proč se tak děje, a za druhé to bohužel nepotřebuji, jelikož dojde k zalomení slov, viz ukázka. Pokud u vnořeného seznamu odstraním styl position: absolute, pak k zalomení nedochází a šířka seznamu je pak správně vůči šířce jeho obsahu (slov, atd.).

Ještě doplním, že tento princip využívám ve vysouvacím menu, kde je menu strukturováno pomocí vnořených seznamů a jednotlivé části (tedy submenu tvořené položkami li) skrývám či naopak zobrazuji na základě výběru uživatele.

Jak tedy docílit nezalomování slov (děje se tak na základě prázdných mezer, pokud místo klasické mezery přidám nedělitelnou (&nbsp;), pak k zalomení nedojde a text se "správně" roztáhne).

http://petrzavicak.cz/ukazky_problemu/ukazka_2.html

Ještě přidám obrázek.
swah
Profil
li ul {} nastavte navíc nějakou šířku, pozice seznamu ul mimo li je pouze "optická", proto je ul ovlivněn šířkou nadřazeného li
Suta
Profil
swah
li ul {} nastavte navíc nějakou šířku

Tomu samozřejmě rozumím, nicméně v mém případě je to přesně to, co udělat nemůžu.

Představte si modře orámovanou položku jako tlačítko menu a červeně orámovanou položku jako vnořené (<ul>) submenu, přičemž bude ono vnořené submenu v optimálním případě obsahovat více položek pod sebou a každá položka bude různě dlouhá ("delší", než text nadřazené (rodičovské) položky menu).

Takže nevím, zda-li na to jdu špatně principově a mám to celé předělat (trápil jsem se s tím několik dnů, učím se na tom...), nebo existuje-li nějaké řešení pro to, co potřebuji.
Chamurappi
Profil
Reaguji na Sutu:
Jak tedy docílit nezalomování slov
<nobr> nebo „white-space: nowrap“.
Suta
Profil
Chamurappi
Mockrát díky!

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: