Проблеми с навигация в IE7

[elina_vg]

Здравейте,
Правя сайт, който се показва идеално в FireFox, но в IE7 навигацията не се показва.
Кодът в html е:

<div id="header-links">
			<ul >
                         <li style="height:289px;"><a href="index.php?page=vinlande" target="_self"  id="first"></a></li>
                        <li style="height:289px;"><a href="index.php?page=reserver_vin"  id="second"></a></li> 
			<li style="height:289px;"><a href="index.php?page=events" id="third"></a></li> 	
                        <li style="height:289px;"><a href="index.php?page=kontakt" id="fourth"></a></li>		
                  </ul>			
		
		</div>

А в css е:

#header #header-links ul{
	position: absolute;
	top: 60px; 	left:0px;
	color: #600;
width:720px;
height:180px;
}

#header #header-links li{
display:block;
float:left;
height:289px;
}

#header #header-links li a#first {	
	padding:0 180px  289px 0;
height:289px;
background:url(uploads/images/vinlande.jpg) no-repeat;
}

#header #header-links li a#first:hover {
height:289px;
		background:url(uploads/images/vinlande_color.jpg) no-repeat;
}


#header #header-links li a#second {	
	padding:0 180px  289px 0;
height:289px;
background:url(uploads/images/reserver.jpg) no-repeat;
}

#header #header-links li a#second:hover{
height:289px;
		background:url(uploads/images/reserver_color.jpg) no-repeat;
}


#header #header-links li a#third  {	
	padding:0 180px 289px 0;
height:289px;
background:url(uploads/images/events.jpg) no-repeat;
}

#header #header-links li a#third:hover {
height:289px;
		background:url(uploads/images/events_color.jpg) no-repeat;
}


#header #header-links li a#fourth {	
height:289px;
	padding:0 180px  289px 0;
background:url(uploads/images/kontakt.jpg) no-repeat;
}
#header #header-links li a#fourth:hover {
		background:url(uploads/images/kontakt_color.jpg) no-repeat;
}

Имате ли някакви идеи какво бих могла да променя за да се покаже и в IE?
Мерси предварително!


mod emagi: хвърли един поглед тук.Точка 11.1

 

[peter3d]

#header #header-links ul{
position: absolute;
margin-top: 60px; margin-left:0px;
color: #600;
width:720px;
height:180px;
}

 

[elina_vg]

Мерси peter3d, но това не ми решава проблема с IE.

 

[shterev]

Проблема ти е в това ,че ползваш position:absolute; и float:left; размени малко местата или го направи тоя absolute в друг елемент.

p.s. няма да е лошо да покажеш и тоя абсолютния елемент в кой елемент се намира и цсс-а

 

[elina_vg]

Разреших си проблема като зададох display:block, width i height на <а> и махнах padding, а също махнах display:block и оставих само float:left на <li>. Така всичко излиза правилно в Firefox, Opera, IE6,7,8. И не се наложи да пипам position.

 

[ajax]

Разреших си проблема като зададох display:block, width i height на <а> и махнах padding, а също махнах display:block и оставих само float:left на <li>. Така всичко излиза правилно в Firefox, Opera, IE6,7,8. И не се наложи да пипам position.

В грешка, си и то голяма от штерев го знам, при други резолюций пак ще имаш разминавания, затова смени си резолюцията и ще разбереш

 

[elina_vg]

И това пробвах. Аз съм с 1680х1050, пробвах го и на по-малки резолюции, всичко е както трябва
Мерси за съвета все пак.

 

[shterev]

ако е използван правилно абсолюта не б итрябвало да има проблеми!!