webForumDet fria alternativet

Konstiga streck i UL pga. text-indent

1 svar · 458 visningar · startad av MickeA.com

MickeA.comMedlem sedan feb. 20034 441 inlägg
#1

Tjena
Håller på med en sida och har nu stött på lite problem med menyn.
I firefox blir det konstiga steck från menyn och rakt ut på sidan högerkant.
En kamrat som har firefox stöter inte på det här fenomenet. I IE funkar allt som det ska.

Misstänker att det här har med text-indent att göra.
Har gjort på det här sättet för att texten i länkarna inte ska synas.

<div id="menu_holder">
	<div id="nav_cont">
		<ul>
		<li id="act1"><a href="#">startsida</a></li>
		<li id="act2"><a href="#">grilltips</a></li>
		<li id="act3"><a href="#">recept</a></li>
		<li id="act4"><a href="#">picanha</a></li>
		</ul>
	</div>		
</div>

CSS'en ser ut som följer:

#nav_cont ul
	{
	width: 158px;
	height:	120px;
	background:	transparent url('../pics/menu_content.gif');
	}
#nav_cont ul li
	{
	list-style-type: none;
	width:			158px;
	height:			30px;
	}

#nav_cont li a:link, #nav_cont li a:active, #nav_cont li a:visited
	{
	display:		block;
	text-indent:	-9999px;
	}
#act1 a:link, #act1 a:active, #act1 a:visited {background: transparent url('../pics/btns/btn_startsida_off.gif'); width: 158px; height: 30px;}
#act2 a:link, #act2 a:active, #act2 a:visited {background: transparent url('../pics/btns/btn_grilltips_off.gif'); width: 158px; height: 30px;}
#act3 a:link, #act3 a:active, #act3 a:visited {background: transparent url('../pics/btns/btn_recept_off.gif'); width: 158px; height: 30px;}
#act4 a:link, #act4 a:active, #act4 a:visited {background: transparent url('../pics/btns/btn_picanha_off.gif'); width: 158px; height: 30px;}

#act1 a:hover {background: transparent url('../pics/btns/btn_startsida_on.gif'); width: 158px; height: 30px;}
#act2 a:hover {background: transparent url('../pics/btns/btn_grilltips_on.gif'); width: 158px; height: 30px;}
#act3 a:hover {background: transparent url('../pics/btns/btn_recept_on.gif'); width: 158px; height: 30px;}
#act4 a:hover {background: transparent url('../pics/btns/btn_picanha_on.gif'); width: 158px; height: 30px;}

Kolla på mina bifogade bilder för att se problemet i firefox.
Har provat massa saker fram och tillbaks, men hur jag än gör så slutar då länkarna att funka.

Tack på förhand!

DUMP_FF.pngDUMP_IE.png
MickeA.comMedlem sedan feb. 20034 441 inlägg
#2

Satt och sökte lite precis och hittade en lösning:
http://www.webforum.nu/showthread.php?p=1097232#post1097232

Men, varför funkar det inte i FF hos mig, men hos min polare.
Hur kan två likadana uppsättningar av firefox tolka CSS olika?

Någon kan stänga tråden ;)

129 ms totalt · 3 externa anrop · v20260731065814-full.fb544a5a
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
126 ms — hämta tråd, inlägg och bilagor (db)