Autor Zpráva
Amunak
Profil
Mám velmi primitivní stránku, na které používám menu s position: fixed pro pohodlnější přechod na kotvy na stránce. Problém je, že to menu pak překrývá text té kotvy, a to je poněkud nežádoucí. Mohl bych tomu sice nastavit padding, ale to pak vypadá dost divně. Existuje nějaké elegantní řešení? (vlastně ani dopředu neznám tu výšku toho menu, počítá se podle písma)

Ukázka (kód)
Str4wberry
Profil
Nastavíš-li padding třeba v em jednotkách, není problém, aby se přizpůsoboval velikosti písma. Od IE 9 by šlo ten padding nastavovat jen pro :target.

Mimochodem, chtělo by to pro menu zvednout z-index — v Opeře mi po kliknutí mizí za obsahem.

Další možnost je menu neposicovat fixně (umístit ho na začátek stránky), ale nechat rolovat jen obsah pod menu namísto celé stránky, tj. přidat mu overflow: auto.
Trejpa
Profil
Amunak:
Prvek s odkazovaným ID musíš dostat nahoru o výšku té lišty.

1) Přidáš horní padding nadpisu s ID a předchozímu elementu nastavíš stejně velký záporný spodní margin - tím se překryje ten padding.

2) Použiješ k odkazování jiný prvek, který z cíleného nadpisu vystrčíš ven:
<h2><span id=k3 style="position: relative; top:-2.6em;"></span>Jak na to</h2>
Amunak
Profil
Str4wberry:
Nastavíš-li padding třeba v em jednotkách, není problém, aby se přizpůsoboval velikosti písma
To je pravda, ale ten padding je docela ošklivý.

Zkoušel jsem to řešení s overflow, ale narazil jsem na to, že bych pak musel nastavit té dolní části pevnou výšku, a ani s CSS3 calc() se mi to nepodařilo vypočítat tak, aby to končilo přesně tam, kde má - tedy aby body nemělo scrollbar, a zároveň aby ten div, co má rolovat, končil přesně u "hrany" prohlížeče. Nevíte jak na to? Umím to udělat s JS, ale to bych nerad.

Nakonec tedy asi použiji to s tím :target - nemá to sice moc velkou podporu v prohlížečích, ale to mě nějak netrápí, protože to je pořád vylepšení oproti předchozímu stavu.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

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