нижний колонтитул сломан в Firefox - PullRequest
Новая
       14

нижний колонтитул сломан в Firefox

0 голосов
/ 03 декабря 2011

столкнулся со странной проблемой, мой очень простой нижний колонтитул не отображается должным образом в Firefox.Это в основном отображение встроенной навигации с плавающей точкой влево и тега с плавающей точкой справа.Кажется, работает нормально в любом другом браузере.Вот код:

HTML 

<div id="footer_wrap">
<div id="footer_area">

<ul id="footer_nav">

    <li><a href="{site_url}" {if segment_1 == "" OR segment_1 == "view"}class="active"{/if}>Blog</a></li>
    <li><a href="{path="/archives"}" {if segment_1 == "archives"}class="active"{/if}>Archives</a></li>
    <li><a href="{path="about"}" {if segment_1 == "about"}class="active"{/if}>About</a></li>

</ul>


    <a href="{site_url}" id="footer_logo">&copy; {current_time format="%Y"} {site_name}</a>

<div class="clear"></div>

</div> <!-- end footer area -->
</div> <!-- end footer wrap -->

CSS 

#footer_nav {float: left; list-style: none;}
#footer_nav li {display: inline; margin-right: 20px;}
#footer_nav li a {
    font-weight: bold; 
    color: #FFFFFF; 
    opacity: 0.8;
    filter: alpha(opacity=80);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=80)";
    text-transform: uppercase; 
    font-size: 12px;
}
#footer_nav li a:hover {
    font-weight: bold; 
    opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=100)";
}
#footer_nav li a.active {
    font-weight: bold; 
    opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=100)";
}

#footer_logo {
    float: right; 
    color: #FFFFFF; 
    font-size: 18px; 
    opacity: 0.8;
    filter: alpha(opacity=80);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=80)";
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
}
#footer_logo:hover {
    opacity: 1;
    filter: alpha(opacity=100);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=100)";
}

Вот упрощенный код, только две ошибки проверки для пустых значений "высоты" наimages 

<div id="footer_wrap">
<div id="footer_area">

<ul id="footer_nav">

    <li><a href="#">Blog</a></li>
    <li><a href="#">Archives</a></li>
    <li><a href="#">About</a></li>

</ul>


    <a href="#" id="footer_logo">&copy; 2011 Mysitename</a>

<div class="clear"></div>

</div> <!-- end footer area -->
</div> <!-- end footer wrap -->

Хорошо

Chrome - Good

Плохо

Firefox - Bad

1 Ответ

0 голосов
/ 04 декабря 2011

(перенесено из редактирование вопроса ):

Наконец-то, ребята, выяснили, что в моей таблице стилей CSS вместо фигурной скобки выше фигурная скобка, что означает всевнизу не было видно ни firefox, ни оперой

...