CSS выглядит плохо в IE - PullRequest
Новая
       14

CSS выглядит плохо в IE

0 голосов
/ 06 сентября 2010

У меня проблема с CSS в IE

Эта страница выглядит хорошо в Firefox, Chrome, Opera .... но в IE "строка даты" перекрывается на первом <li> баре

Здесь: http://www.animefushigi.com/latest-episodes

CSS выглядит следующим образом: 

#content h2.other-posts {
    height: 31px;
    font-size:12px;
    line-height: 31px;
    background: #2c2b2b;
    padding: 0 10px;
    border: 1px solid #1b1b1b;
    color: #888888;
    margin-bottom:1px;
}

#content #other-posts {
    list-style: none;
    padding: 1px;
    margin-top:15px;
    margin-bottom:15px;
    margin-left: 20px;
}
#other-posts li {
    list-style: none;
    background: #151515;
    height: 30px;
    line-height: 30px;
    border-left: 1px solid #050505;
    border-right: 1px solid #151515;
    border-bottom: 1px solid #050505;
    border-top:1px solid #0f0f0f;
    margin-bottom: 1px;
    padding: 0 10px;
}

#other-posts li a {
    float: left;
}

Файл Wordpress PHP выглядит следующим образом: 

<ul id="other-posts">

<?php
$postslist = get_posts('numberposts=50&order=desc&orderby=date');
foreach ($postslist as $post) : setup_postdata($post);
?> 
<?php the_date('', '<h2 class="other-posts">Added on ', '</h2>'); ?>

 <li><a href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>">
   <?php the_title(); ?>
   </a></li>

<?php endforeach; ?>
</ul>

Как сделать этот браузер дружественным?

Ответы [ 2 ]

2 голосов
/ 06 сентября 2010

Я бы предложил вам использовать IE условные комментарии. Таким образом, вы можете использовать таргетинг на IE с помощью таблицы стилей, специфичной для IE.

<!--[if IE]><link rel="stylesheet" type="text/css" href="ie/specific/css.css"> <![endif]-->

0 голосов
/ 06 сентября 2010

try: 

#other-posts li { display:inline }

вместо применения правила отображения к "li a".Это элемент списка, который вы хотите отобразить в строке, а не ссылки внутри.

РЕДАКТИРОВАТЬ: Очень жаль.Не знаю, откуда пришло «без».

Попробуйте удалить поплавок и указать ширину или высоту списка.

...