Witam,
Tworze takie oto menu:
http://www.star-bruk.pl/pomocy/menu.png <-- pokazane jak działa w różnych przeglądarkach, na
pierwszy rzut oka jest ok, ale po przyjrzeniu się widać, że w firefoxie napisy są wyśrodkowane jak trzeba, a w całej
reszcie nie. Bawiąc się margin-top, mogłem poprawić na każdej innej przeglądarce ale wtedy w firefox było na nisko...
oto link do strony:
http://www.star-bruk.pl/pomocy/panel/ustawienia.phpno i kod:
html:
<!-- menu -->
<a href="ustawienia.php" id="start_button"><div class="font_text_button_menu"><div id="f1">START
</div></div></a> <div class="space_menu_button"></div> <a href="aktualnosci.php" id="kluby_button"><div class="font_text_button_menu"><div id="f2">KLUBY
</div></div></a> <div class="space_menu_button"></div> <a href="zespol.php" id="zespol_button"><div class="font_text_button_menu"><div id="f3">ZESPÓŁ
</div></div></a> <div class="space_menu_button"></div> <a href="sponsorzy.php" id="sponsorzy_button"><div class="font_text_button_menu"><div id="f4">SPONSORZY
</div></div></a> <div class="space_menu_button"></div> <a href="terminarz.php" id="terminarz_button"><div class="font_text_button_menu"><div id="f5">TERMINARZ
</div></div></a> <div class="space_menu_button"></div> <a href="fotki.php" id="fanzone_button"><div class="font_text_button_menu"><div id="f6">FANZONE
</div></div></a> <div class="space_menu_button"></div> <a href="zaczki.php" id="mlodziez_button"><div class="font_text_button_menu"><div id="f7">MŁODZIEŻ
</div></div></a> <div class="space_menu_button"></div> <a href="prasa.php" id="prasa_button"><div class="font_text_button_menu"><div id="f8">PRASA
</div></div></a> <div class="space_menu_button"></div> <!-- koniec menu -->
css:
@font-face
{
font-family: 'Aller_lt';
src: url(../font/Aller_Lt.ttf) format("truetype");
}
@font-face
{
font-family: 'Aller_Rg';
src: url(../font/Aller_Rg.ttf) format("truetype");
}
body
{
margin: 0;
padding: 0;
background-color: black;
font-family: Aller_lt;
}
#main_frame
{
margin: 0 auto;
background-color: black;
width: 1000px;
height: 534px;
}
#menu
{
clear: both;
width: 1000px;
height: 40px;
border-bottom: 1px solid black;
}
#start_button
{
width: 80px;
height: 40px;
background-image: url('../img/button_1_bg.png');
background-repeat: repeat-x;
float: left;
text-decoration: none;
}
#kluby_button
{
width: 72px;
height: 40px;
background-image: url('../img/button_1_bg.png');
background-repeat: repeat-x;
float: left;
text-decoration: none;
}
#zespol_button
{
width: 88px;
height: 40px;
background-image: url('../img/button_1_bg.png');
background-repeat: repeat-x;
float: left;
text-decoration: none;
}
#sponsorzy_button
{
width: 118px;
height: 40px;
background-image: url('../img/button_1_bg.png');
background-repeat: repeat-x;
float: left;
text-decoration: none;
}
#terminarz_button
{
width: 115px;
height: 40px;
background-image: url('../img/button_1_bg.png');
background-repeat: repeat-x;
float: left;
text-decoration: none;
}
#fanzone_button
{
width: 100px;
height: 40px;
background-image: url('../img/button_1_bg.png');
background-repeat: repeat-x;
float: left;
text-decoration: none;
}
#mlodziez_button
{
width: 105px;
height: 40px;
background-image: url('../img/button_1_bg.png');
background-repeat: repeat-x;
float: left;
text-decoration: none;
}
#prasa_button
{
width: 83px;
height: 40px;
background-image: url('../img/button_1_bg.png');
background-repeat: repeat-x;
float: left;
text-decoration: none;
}
#puste
{
width: 231px;
height: 40px;
background-image: url('../img/button_1_bg.png');
background-repeat: repeat-x;
float: left;
}
.space_menu_button
{
width: 1px;
height: 40px;
background-image: url('../img/space_menu_button.png');
float: left;
}
.font_text_button_menu
{
margin-top: 11px;
text-align: center;
color: #525252;
font-size: 14px;
font-family: Aller_Rg;
font-weight: bold;
}
Bardzo proszę o pomoc! - wiem, ze tam moge zaladowac zdjecia, ale jest rozwiazanie ktore mnie nie satysfakcjonuje. Probowalem tez uzyc hight-line w font_text_button_menu,
ale nie pomoglo. Pomysly sie wyczerpaly. Pomocy!