Autor Zpráva
Kositch
Profil
Vážení přátelé,
chtěl bych Vás poprosit o radu.
Vytvořil jsem si web v RS Joomla a do šablony vzhledu, kterou jsem si vybral, jsem potřeboval na jisté místo umístit dva obrázky s ikonou cz a en. Ikonky jazyků se mi zobrazují korektně v IE8 + FF + Opera, ale v IE 6 jsou ikonky o kus výše a hlavně vytvoří kus černého pruhu v headeru.

Zde je ukázka části kódu html šablony, kam jsem vložil kód pro css pozicované ikonky cz a en:

<div id="header_top"></div>
		<div id="header">
			<a href="/" title="Fotogalerie - Michal Srna"><div id="header_img"></div></a> 	
		   
                   <div class="language"> - toto jsem přidal
		        <a href="/" title="CZ"><img  src="/images/stories/cz_flag.gif" alt="CZ"></a> - toto jsem přidal
                        <a href="/en" title="EN"><img  src="/images/stories/en_flag.gif" alt="EN" hspace="5"></a> -  toto jsem přidal  
                   </div> - toto jsem přidal

                </div>
		<div id="header_bottom"></div>


A zde přikládám ukázku z css kde je pozicována třída language:

.language {
	position: relative;
	left: 830px;
	top: 10px
}


Byl bych Vám opravdu vděčný, kdybyste mi poradili, co a jak pozměnit, aby se to korektně zobrazilo i v IE6.
Pokud chcete vidět jak tento problém vypadá v reálu v IE6, můžete na adresé té stránky:
michalsrna.cz

Děkuji za jakoukoliv radu !!
Chamurappi
Profil
Reaguji na Kositche:
Máš docela ošklivý kód. Proč nepoužíváš na obrázky obrázky? Proč <div id="header_img"></div> a ne <img>?
Jen výjimečně se vyplatí používat relativní pozicování, v tomto případě bych se mu vyhnul.

Explorer 6 roztáhne <div id="header"> tak, aby se do něj vešly vlaječky, protože height bere jako min-height. Pokud necháš výšku oříznout pomocí „overflow: hidden“, vlaječky zmizí, protože se je snažíš vyšoupnout mimo plochu elementu.

Pro <div id="header"> nastav „position: relative“ (jen proto, aby se utvořil kontext souřadnic) a pro <div class="language"> nastav „position: absolute“ — tím dosáhneš shodného vzhledu napříč prohlížeči a pak už jen srovnej pozici.
Kositch
Profil
Reaguji na Chamurappi:
Děkuji Vám za užitečnou radu - pomohla a nyní se vše zobrazuje tak jak má i v IE6. Veškerý kód je součástí již předem nainstalované šablony vzhledu, takže nevím proč se nepoužívá tag <img> namísto <div id="header_img"></div>. Tento kód jsem nepsal, nýbrž ho psal autor šablony.

Nicméně ještě jednou díky, s pozdravem Michal.

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: