Autor Zpráva
Jiří
Profil *
Potřebuji vyřešit zajímavý problém na mém webu: na www.flagrantni.wz.cz/diskuze/reakce se v horní liste nad textem, která popisuje zanořování je přidán styl odstavece (lista je zformátovaný odstavec) - IE6 to zobrazí přesně tak, jak je to nadef. s pozadím, zatímco Mozilla (o které si myslím, že od jisté doby zobrazuje stránky lépe a standardněji oproti IE) listu zobrazí bez barvy a obrázku v pozadí - nechápu tu.

Další problém je na stránce http://www.flagrantni.wz.cz/uvahy/skolne-vs-nespasi.htm: úplně dole jsou "blokové" odkazy jako tlačitka, oba dva jsou v odstavci, kterým IE přiděluje dědičné okraje, zatímco Mozilla nedědí okraje. Co je špatně, resp. jaký prohlížeč to interpretuje lépe?

Ad 1
<p id="lista"><a href="../index.htm">Diskuze</a> → <strong>Reakce</strong></p>

#lista
{padding: 5px 0 6px 25px;
margin: 2px 1px 0px 18px;
border-bottom: 1px solid #fff;
font-size: 11px;
line-height: 1em;
background: #ecedf0 url('img/menu-active.gif') left 1px repeat-y}

Ad2
<p class="podclanek"><a href="javascript:blank('../vzkaz.htm');">reagovat na článek</a>
<a href="index.htm">zpět do tématické sekce</a></p>

.podclanek
{margin: auto auto auto 110px} Je rozdíl pro nějaký prohlížeč v zápisu
{margin-left: 110px}

(...)


Velmi děkuji za analýzu a ODPOVĚĎ
Jirka
Plaváček
Profil
K prvnímu problému, netestoval jsem to, ale zkusil bych definici pozadí pro začátek upravit takto:

background: #ecedf0 url('img/menu-active.gif') repeat-y}

to znamená vynechat to umístění nahoru 1px. Setkal jsem se s tím, že některé verze Netscape nebo Mozilly mají s takto definovaným pozadím problémy. Mohlo by to zabrat.

K druhému dotazu: margin a padding se nedědí u žádného elementu, tedy ani u odstavce (protože se mi druhý odkaz nezobrazil, nemohu posloužit konkrétně). Problém je možná spíše v tom, že každý prohlížeč mívá pro blokové elementy nastavené výchozí hodnoty (konkrétně pro odstavce to platí všeobecně a bohužel má každý prohlížeč jiné). Zkuste si margin i padding pro odstavec vynulovat.

Já osobně používám na prvním místě stylopisu tento zápis:

* {
margin: 0;
padding: 0;
}

tímto zápisem odstraníte všechny výchozí hodnoty a budete mít lepší přehled. Okraje i výplně si pak pro jednotlivé elementy už dodefinujete.
Yuhů
Profil
Nahraď řádek

background: #ecedf0 url('img/menu-active.gif') left 1px repeat-y}

zápisem

background: #ecedf0 url('img/menu-active.gif') 0px 1px repeat-y}

Mozilla a Opera mají problém s kombinací slovního a číselného zápisu (left 1px).
Toto téma je uzamčeno. Odpověď nelze zaslat.