Problem z wyśrodkowaniem menu w IE

[gtomczyk]

Witam,

stronka: http://zgk-witkowo.pl/
Menu poziome, Firefox, Chrome prezentują poprawnie, menu jest wyśrodkowane.
Internet Explorer przesuwa menu w prawą stronę :(

Będę bardzo wdzięczny za ewentualną pomoc w prawidłowym skonfigurowaniu kodu pod kątem IE

Pzdr

Fragment css dot. menu:


#slideshow {
background-color: #e7e7e7;
width: 1000px;
margin: auto;
}#slides {
padding: 0px 0 0px 0;
clear: both;
position:relative;
}

.slides_container {
width:1000px;
height:300px;
overflow:hidden;
position:relative;
z-index: 1;
}
.slides_container a,
.slides_container img {
display: block;
width:1000px;
height:300px;
}
#slides .next,
#slides .prev {
position:absolute;
top: 0px;
left: 0px;
width:38px;
height:38px;
background-image:url(../images/slides_arrows.png);
z-index:10;
}
#slides .next {
left:176px;
}
.slides_nav {
display: none;
}

.slides_nav a.prev {
background-position: 0 0;
margin: 181px 0 0 0px;
}
.slides_nav a:hover.prev {
background-position: 80px 200px;
}
.slides_nav a.next {
background-position: 160px 0;
margin: 181px 0 0 786px;
}
.slides_nav a:hover.next {
background-position: 40px 200px;
}
#slides ul.pagination {
border: 0;
position: absolute;
z-index: 10;
margin: -36px 0 0 -20px;
}

#slides ul.pagination li {
float:left;
margin: 0 -3px 0 0;
list-style:none;
}
#slides ul.pagination li a {
display:block;
width:12px;
height:0;
padding-top:12px;
background: url(../images/slides_arrows.png) 0 160px;
float:left;
overflow:hidden;
}
#slides ul.pagination li.current a {
background: url(../images/slides_arrows.png) 188px 160px;
}


Fragment html menu:


<!-- Topmenu -->
<div id="topmenu">
<jdoc:include type="modules" name="position-1" />
</div>

<!-- Slides -->
<?php if (($this->countModules('position-15') && $slides == 2) || ($slides == 1)): ?>
<div id="slideshow">
<div id="slides"><div class="slides_container"><?php if ($slidesimage1): ?><?php if ($slideslink1): ?><a href="<?php echo $slideslink1; ?>"><?php endif;?><img src="<?php echo $slidesimage1; ?>" alt="" /><?php if ($slideslink1): ?></a><?php endif;?><?php endif;?><?php if ($slidesimage2): ?><?php if ($slideslink2): ?><a href="<?php echo $slideslink2; ?>"><?php endif;?><img src="<?php echo $slidesimage2; ?>" alt="" /><?php if ($slideslink2): ?></a><?php endif;?><?php endif;?><?php if ($slidesimage3): ?><?php if ($slideslink3): ?><a href="<?php echo $slideslink3; ?>"><?php endif;?><img src="<?php echo $slidesimage3; ?>" alt="" /><?php if ($slideslink3): ?></a><?php endif;?><?php endif;?><?php if ($slidesimage4): ?><?php if ($slideslink4): ?><a href="<?php echo $slideslink4; ?>"><?php endif;?><img src="<?php echo $slidesimage4; ?>" alt="" /><?php if ($slideslink4): ?></a><?php endif;?><?php endif;?><?php if ($slidesimage5): ?><?php if ($slideslink5): ?><a href="<?php echo $slideslink5; ?>"><?php endif;?><img src="<?php echo $slidesimage5; ?>" alt="" /><?php if ($slideslink5): ?></a><?php endif;?><?php endif;?><?php if ($slidesimage6): ?><?php if ($slideslink6): ?><a href="<?php echo $slideslink6; ?>"><?php endif;?><img src="<?php echo $slidesimage6; ?>" alt="" /><?php if ($slideslink6): ?></a><?php endif;?><?php endif;?></div>
<div class="slides_nav">
<a href="#" class="prev"></a>
<a href="#" class="next"></a>
</div>
</div>
</div>
<?php endif; ?>

[AndiC]

Wklejasz kod CSS dla slidera i twierdzisz że jest dla menu ?
Klasą jest "topmenu" i to w niej masz zdefiniowany rozmiar czcionki.
Jako że topmenu jest wyrównane do lewej i nie ma ograniczenia szerokości, rozmiar czcionki ma znaczenie.
Doraźnie proponuję zmienić rozmiar czcionki dla "topmenu" na 1,1em


​Poprawka, topmenu ma ograniczenie na szerokość, tyle że jest przesunięte parametrem "padding-left:40px;"

[AndiC]

​Poprawka, topmenu ma ograniczenie na szerokość, tyle że jest przesunięte parametrem "padding-left:40px;" czyli ten parametr wyłącz.
Będzie inaczej ale chyba lepiej.
Pozostanie tylko wypełnienie brakującego koloru tła, ale z tym chyba sobie poradzisz ?

[gtomczyk]

AndiC,

przede wszystkim bardzo dziękuję za tak szybką odpowiedź. Zaprezentowałem kod klasy slideshow bo myślałem że będzie również pomocny.
Zastosowałem twoje wskazówki. Efekt jest taki jaki chciałem osiągnąć :)



Pozostanie tylko wypełnienie brakującego koloru tła, ale z tym chyba sobie poradzisz ?

Zamieniłem tło menu z koloru szarego jaki był pod spodem na kolor żółty.
Menu się prezentuje ładnie.
Jedynym minusem teraz jest to, że kiedy wybieram dowolną pozycję z topmenu, to na krótko, kiedy pokazuje się obrazek ładowania strony, wyskakuje również żółty kolor tła dający po oczach.

Jest na to jakieś szybkie rozwiązanie, że tak jeszcze raz Ciebie poproszę o pomoc ??

[AndiC]

Nie zmieniaj koloru dla #slideshow
Dodaj warunek dla #topmenu ul width:1000px;

[gtomczyk]

Poprawiłem, jeszcze raz wielkie dzięki.
Wierzę że może kiedyś będę miał okazję się odwdzięczyć.

You Rock AndiC!